四智能体 Figma MCP 配置教程
配置完成后Codex / Claude Code / Hermes / OpenCode 都能直接读取 Figma 设计稿实现「设计→代码」。用户xxx | Token 类型figd_Personal Access Token前置条件1. 获取 Figma Personal Access Token打开 Figma → 右上角头像 →Settings左侧菜单 →Personal Access Tokens点击Generate new token输入名称如agents-mcp权限选择File content只读设计稿内容即可复制生成的 token格式figd_xxxxxxxx只显示一次2. 确认网络可达curl-HX-Figma-Token: figd_YOUR_TOKENhttps://api.figma.com/v1/me返回{id:...,email:...,handle:...}即正常。Figma MCP 端点https://mcp.figma.com/mcp一、Codex~/.codex/config.tomlCodex 的 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 AgentD:/.hermes/config.yaml 或 ~/.hermes/config.yaml在mcp_servers段添加mcp_servers:figma:type:httpurl:https://mcp.figma.com/mcpheaders:X-Figma-Token:figd_YOUR_TOKENtimeout:30connect_timeout:15生效方式重启 Hermes Gatewayhermes 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 或新开对话。快速对照平台配置文件配置段Token 传法生效方式Codex~/.codex/config.toml[mcp_servers.figma]环境变量FIGMA_ACCESS_TOKEN重启客户端Claude Code~/.claude/settings.jsonmcpServers.figmaHTTP HeaderX-Figma-Token新会话 或/mcpHermes~/.hermes/config.yamlmcp_servers.figmaHTTP HeaderX-Figma-Token重启 GatewayOpenCode~/.config/opencode/opencode.jsonmcp.figmaHTTP HeaderX-Figma-Token重启应用排错症状原因解决401 UnauthorizedToken 无效或未传检查 token 是否过期/复制完整figd_ tokens must be passed via X-Figma-Token header用了Authorization: Bearer改用X-Figma-Tokenheader405 Method Not AllowedGET 请求MCP 需要 POST JSON-RPC工具列表为空MCP 未重载重启对应工具Codex 能连但 Hermes 不能Hermes 不支持 env 方式改用 HTTP header
)
