mcpField
F
Figma Mcp Express

Figma Mcp Express

本地服务
github.com/sunhome243开发工具911 周前更新

关于 Figma Mcp Express

Figma Mcp Express 通过插件桥接,让本地 Agent 检查和修改已打开的 Figma Desktop 文件。它支持多文件路由、设计系统迁移和原型操作,多数实时操作无需令牌。

主要功能

  1. 01读取和编辑实时 Figma 节点与样式
  2. 02通过独立通道路由多个打开的文件
  3. 03迁移组件、变量和样式
  4. 04检查并连接原型流程
  5. 05在 Figma 插件中显示 Agent 活动
  6. 06将大型读取结果写入磁盘

适用场景

  1. 01在设计文件间迁移组件库
  2. 02审查大型文件并重新绑定设计令牌
  3. 03为设计交接提供组件和令牌上下文
  4. 04检查并连接原型导航和叠加层

MCP 相关

向 MCP 客户端提供 Figma 检查、编辑、迁移和原型工具。多数实时操作通过正在运行的 Figma Desktop 插件连接;通过 fetch_library_catalog 查询库目录则需要 FIGMA_TOKEN。

配置

本地服务的配置在各客户端中通用,复制后粘贴到客户端的 MCP 配置文件即可。

mcp.json · 通用配置
{
"mcpServers": {
"sunhome243-figma-mcp-express": {
"command": "npx",
"args": [
"-y",
"figma-mcp-express"
]
}
}
}
启动命令npx -y figma-mcp-express

本地服务需要在你的电脑上安装运行环境(如 Node.js 18+)。各客户端的配置文件位置不同,请参考客户端文档。

安装包
npmfigma-mcp-express2.8.1

工具

22

收录的工具列表 · 更新于 2 周前

参数类型必填说明
opsarray是按顺序排列的操作。每项格式:{type: BatchOpCatalog 操作名称, nodeIds?:...
originenum是来源:orchestrator/self=wolfgang;工作器使用分配的名称....wolfgang | grace | theo | sunho | zoe | taewon | emma | alex | rick
channelstring否可选。通过 channel id 指定特定的已连接文件...
validateOnlyboolean否验证声明式 batch/FigmaPlan 负载并返回一个...
continueOnErrorboolean否覆盖默认停止策略:true = 运行所有操作并报告...

详细介绍

figma-mcp-express

Figma MCP Express 主视觉:AI Agent 通往 Figma 的快车道

许可证:MIT Go npm 兼容 Claude Code 兼容 Codex

为编码 Agent 打造的快速、无配额限制且稳定的 Figma 自动化工具。 figma-mcp-express 让 Claude Code、Codex 和其他本地 Agent 能够在真实的 Figma Desktop 文件中读取、编辑、迁移、审计、截图和制作原型。它专为严肃的设计系统工作打造:支持批量编辑、多文件路由、大文件读取、可视化的多 Agent 活动,以及原型连线,无需消耗官方 Figma MCP 工具调用配额。

当截图和评论不够用时,就用它。Agent 可以检查实际的节点、组件、变量、样式、画板、原型交互和关联文件,然后直接在设计师日常使用的文件中进行有针对性的修改。

演示

多个 AI Agent 在 Figma 中实时构建屏幕

观看演示视频

实时跟进 AI Agent 如何直接在 Figma 中修复问题、编辑布局和设计屏幕。

团队选择它的原因

  • 自动化更多,不再受配额限制。 常规的插件端工作不受官方 Figma MCP 服务基于席位的工具调用限制。
  • 精简的工具集。 与 vkhanhqui/figma-mcp-go@fe6cd768(本次测量采用的中间分支基准)相比,默认的 tools/list 从 73 个工具/12,214 个 o200k_base token 减少到 21 个工具/3,283 个 token(缩减 73.1%),让 Agent 在开始工作前消耗更少的上下文。
  • 获取真实的 Figma 上下文,而非截图。 Agent 可以在已打开的 Desktop 文件中处理实时节点、组件、变量、样式、画板、截图和原型链接。
  • 专为设计系统迁移打造。 通过不同通道分别路由源组件库和产品文件,然后用正确的组件和令牌重建屏幕。
  • 适用于多 Agent 运行。 实时查看 Agent 活动、跟进某个 Agent 的编辑,并按通道分隔文件会话。
  • 大文件依然易用。 大型读取结果会写入磁盘,让 Agent 只检查有用的部分,而不会淹没模型上下文。
  • 将原型自动化融入工作流。 读取原型流程、设置交互并指定流程起点。

功能

  • 在 Figma 插件中查看实时 Agent 活动。
  • 使用内置的 AI Agent 技能构建精致的 Figma 屏幕。
  • 通过不同通道路由多个已打开的文件。
  • 使用真实的组件、变量和样式迁移设计系统。
  • 在已打开的 Figma 文件中直接读取原型流程并连线。

适用场景

  • 设计系统迁移和组件库替换
  • 大型文件审计、清理和令牌重新绑定
  • 需要真实令牌和组件上下文的设计到代码交接
  • 应使用实际组件库而非原始图形的提示词到 Figma 工作流
  • 用于导航、叠层、过渡和流程起点的原型审计与连线

快速开始

1. 安装服务

安装插件是最快的方式。

Claude Code

claude plugin marketplace add sunhome243/figma-mcp-express
claude plugin install figma-mcp-express@figma-mcp-express

Codex

codex plugin marketplace add sunhome243/figma-mcp-express
codex plugin add figma-mcp-express@figma-mcp-express
2. 导入 Figma Desktop 插件
  1. 下载 plugin.zip,或从源代码构建。
  2. 在 Figma Desktop 中,前往 Plugins -> Development -> Import plugin from manifest...。
  3. 从解压后的插件文件夹或本仓库的 plugin/ 目录中选择 manifest.json。
3. 运行
  1. 在 Figma Desktop 中打开目标文件。
  2. 启动 Plugins -> Development -> Figma MCP Express。
  3. 在 Agent 工作期间保持插件运行。
  4. 如果打开多个文件,每个文件都会获得自己的通道 ID,以支持多文件工作流。

重要限制

  • 大多数实时工具都要求在 Figma Desktop 中打开目标文件并运行插件。
  • fetch_library_catalog 是主要的纯 REST 例外,需要 FIGMA_TOKEN。
  • 插件在每个文件中仍按单线程执行;服务端会减少争用,但无法让单个文件实现完全并行。
  • 社区资源包必须先发布为库,import_component_by_key 才能使用。
  • 远程跟随者(测试版)仅限私有 Tailnet。 这不是公共 MCP URL:请让领导端仅监听 loopback,通过 Tailscale Serve 暴露(绝不要使用 Funnel),并让 AI 客户端连接到跟随者本地的 /mcp。请参阅 DEV-SETUP.md。
从源代码构建

适用于其他 MCP 客户端,或你想修改服务端的情况:

git clone https://github.com/sunhome243/figma-mcp-express.git
cd figma-mcp-express
make build

这会生成 bin/figma-mcp-express 和 plugin/dist/。

将其添加到 .mcp.json:

{
  "mcpServers": {
    "figma-mcp-express": {
      "command": "/absolute/path/to/bin/figma-mcp-express",
      "args": ["--port", "1994"]
    }
  }
}

构建完成后,重启 MCP 客户端。

高级环境变量
FIGMA_TOKEN

大多数工作流不需要令牌。实时读写工具通过插件直接与 Figma Desktop 通信。

仅在进行由 REST 支持的库目录查询(例如 fetch_library_catalog)时需要 FIGMA_TOKEN。

  • 在 Figma 中通过 Account Settings -> Personal access tokens 生成
  • 目录查询只需文件的只读访问权限
  • 请将其视为密码,切勿提交

如果从 Marketplace 安装,请在 shell 配置文件中设置:

echo 'export FIGMA_TOKEN=your_token_here' >> ~/.zshrc
source ~/.zshrc

如果从源代码构建,可以在 shell 中导出该变量,或将其放入本地 .env 文件:

cat <<'EOF' > .env
FIGMA_TOKEN=your_token_here
EOF

shell 环境变量的优先级高于 .env。

变量默认值说明
FIGMA_TOKEN-仅 fetch_library_catalog 需要。
FIGMA_MCP_TOOL_PROFILEcorecore 保留紧凑的默认工具集。full 恢复旧版兼容性/调试工具集。
FIGMA_MCP_TOOL_SCHEMA_MODEcompactcompact 会精简 tools/list 的描述,以减少 MCP 上下文令牌。使用 verbose 可查看完整的架构内指南。
FIGMA_MCP_BATCH_MAX_OPS200插件执行前允许的顶层 batch.ops 条目数量上限。
FIGMA_MCP_BATCH_MAX_BYTES2097152插件执行前允许的编码后 batch.ops 负载大小上限(字节)。
FIGMA_MCP_STDIO_WORKERS16stdio 工具调用的工作线程数。服务端本地工具可以并发运行;面向插件的调用仍会按 Figma 文件串行执行。
FIGMA_MCP_STDIO_QUEUE1000mcp-go 回退到同步处理前,stdio 工具调用队列可缓冲的大小。
FIGMA_MCP_SPILL_BYTES25000响应大小阈值。超过该值的响应会写入 .figma-mcp-cache/。
FIGMA_MCP_TIMEOUT120轻量操作的不活动时间上限,单位为秒。每次进度心跳都会重置计时。
FIGMA_MCP_READ_TIMEOUT600重型读取和 batch 操作的不活动时间上限,单位为秒。每次进度心跳都会重置计时。
FIGMA_MCP_STALL_THRESHOLD45操作无进度时可占用通道串行槽位的秒数上限;超出后,该通道的新调用会被快速拒绝。

更多文档

  • 完整工具目录见 TOOLS.md
  • 有关队列、路由、溢写到磁盘和恢复行为的信息,见 ARCHITECTURE.md
  • 本地构建、重新构建和测试说明见 DEV-SETUP.md

致谢

本项目所依据的原始桥接架构和实现由 GETHOPP LTD 在 gethopp/figma-mcp-bridge@82b28bc 创建,并依据 MIT 许可证发布。

figma-mcp-express 最初是基于一个中间分支创建的,当时我们并不知道更早的来源。了解完整的传承脉络后,我们恢复了 GETHOPP LTD 的版权声明,并现在直接致谢原始项目。我们重视健康、透明的开源生态,并致力于明确标注作者身份和衍生关系。

LICENSE 中保留了所需的第三方版权声明。figma-mcp-express 采用 MIT 许可证,允许商业使用。

评论

支持 Markdown

第一次接触 MCP?

从协议是什么,到在客户端里装上第一个服务,这几条回答覆盖了大多数入门问题。

一个开放协议,规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话,MCP 服务负责提供工具、资源和提示模板,两者通过标准消息通信,同一个服务可以被不同客户端复用。