四智能体 Figma MCP 配置教程

配置完成后，Codex / Claude Code / Hermes / OpenCode 都能直接读取 Figma 设计稿，实现「设计→代码」。

用户：xxx | Token 类型：figd_（Personal Access Token）

前置条件

1. 获取 Figma Personal Access Token

2. 确认网络可达

curl -H "X-Figma-Token: figd_YOUR_TOKEN" https://api.figma.com/v1/me

返回 {"id":"…","email":"…","handle":"…"} 即正常。

Figma MCP 端点：https://mcp.figma.com/mcp

一、Codex（~/.codex/config.toml）

Codex 的 MCP 配置在 [mcp_servers] 段中。

[mcp_servers.figma]
type = "http"
url = "https://mcp.figma.com/mcp"

[mcp_servers.figma.env]
FIGMA_ACCESS_TOKEN = "figd_YOUR_TOKEN"

注意：Codex 传递 token 使用 FIGMA_ACCESS_TOKEN 环境变量名，不是 HTTP header。

保存后重启 Codex 客户端或新开会话即可生效。验证：

在 Codex 中输入：/mcp → 确认 figma 显示为 connected

二、Claude Code（~/.claude/settings.json）

在 mcpServers 对象中添加 figma 条目：

{
"mcpServers": {
"figma": {
"type": "url",
"url": "https://mcp.figma.com/mcp",
"headers": {
"X-Figma-Token": "figd_YOUR_TOKEN"
}
}
}
}

生效方式：

• 新开会话自动加载
• 已有会话：输入 /mcp 手动重载

三、Hermes Agent（D:/.hermes/config.yaml 或 ~/.hermes/config.yaml）

在 mcp_servers 段添加：

mcp_servers:
figma:
type:
http
url:
https://mcp.figma.com/mcp
headers:
X-Figma-Token:
figd_YOUR_TOKEN
timeout:
30
connect_timeout:
15

生效方式：重启 Hermes Gateway

hermes gateway restart

或者新建会话（HTTP 类型 MCP 自动连接）。

四、OpenCode（~/.config/opencode/opencode.json）

在 mcp 对象中添加 figma 条目：

{
"mcp": {
"figma": {
"type": "remote",
"url": "https://mcp.figma.com/mcp",
"headers": {
"X-Figma-Token": "figd_YOUR_TOKEN"
},
"enabled": true
}
}
}

生效方式：重启 OpenCode 或新开对话。

快速对照

排错