深度拆解 Figma 生态中 5 个 MCP 工具——Figma 官方 MCP、Framelink、cursor-talk-to-figma、Vibma、Claude.ai 连接器，从只读到对话式构建设计系统的完整光谱。
当 AI Agent 开始直接操控设计工具，设计师的工作流正在被重新定义。本文深度拆解当前 Figma 生态中最重要的 5 个 MCP 工具——从只读取设计数据到对话式构建完整设计系统，帮你找到最适合自己工作流的那一个。
MCP（Model Context Protocol）是一个开放协议标准，允许 AI 模型（如 Claude、GPT）通过标准化接口与外部数据源和工具进行交互。可以把它理解为 AI 的「万能适配器」——让 AI 不再只能处理文本，而是能直接读取、理解甚至操控 Figma 设计文件。
对设计师而言，MCP 的意义在于：AI 不再需要通过截图来「猜」你的设计意图，而是能直接访问设计变量、组件层级、Design Token 等语义化的设计数据。这彻底改变了设计与开发之间的协作模式。
目前 Figma 生态中主要有 5 个 MCP 工具值得关注，它们各自定位不同，覆盖了从「读取设计」到「AI 直接在 Figma 里建设计系统」的完整光谱。
定位：Figma 的「亲儿子」，Design → Code 的官方解决方案
Figma 官方推出的 MCP 服务器，提供两种运行模式：远程模式（连接 https://mcp.figma.com/mcp，无需安装桌面端）和桌面模式（通过 Figma 桌面应用本地运行）。通过 OAuth 认证，与 Figma 账户深度绑定。
开发者需要从 Figma 设计稿生成前端代码、需要 Code Connect 保持代码与设计系统一致、需要将 Live UI 反向导入 Figma 进行审查。
定位：社区最流行的只读方案，「让 AI 理解设计而非抄设计」
由 GLips 开发的开源 MCP 服务器，通过 Figma API 读取设计数据并传递给 AI 编码工具。项目全称 figma-developer-mcp，品牌名 Framelink。GitHub 上获得了大量 star，是社区使用最广泛的 Figma MCP 方案。
两者底层使用相同的 Figma API，速率限制也完全一致。核心区别在于数据传递方式：
leading-[22.126px] 这类任意精度值的 React/Tailwind 代码——AI 容易直接复制，产生不符合设计系统规范的冗余代码
Framelink 的理念是：规定性输出会「污染上下文」，导致 AI 生成的代码偏离你已有的设计系统和编码规范。开发者从 Figma 设计稿生成代码，特别是已有成熟设计系统和 Tailwind/Token 体系的团队——Framelink 的描述性数据输出能让 AI 更好地匹配你已有的代码规范。
定位：双向操控的先驱，让 AI 在 Figma 里「动手」
由 sonnylazuardi（现就职于 Grab）开发的开源项目，是第一个实现 AI Agent 与 Figma 双向通信的 MCP 方案。不仅能读取设计，还能直接在 Figma 中创建、修改、删除设计元素。
与前两个工具不同，cursor-talk-to-figma 的架构包含三个部分：
读取类：获取文档信息、当前选中元素、节点详情、样式、注解、原型交互，导出节点为图片
写入类：创建矩形、Frame、文字等基础元素，设置填充色、描边色，调整大小、位置，克隆、删除节点，设置 Auto Layout 属性，设置圆角
组件类：创建组件实例，读取和应用 Override 属性，在不同实例之间传播 Override（批量操作利器）
Prompt 策略：内置多个引导性 Prompt——设计策略、读取设计策略、文本替换策略、注解转换策略、实例 Override 传播策略
设计师或开发者需要让 AI 直接在 Figma 中执行具体的设计操作——批量替换文本、创建元素、调整布局、传播组件 Override。适合「让 AI 帮你干 Figma 里的体力活」的场景。
定位：cursor-talk-to-figma 的增强版，专为 AI 构建设计系统而生
ufira 团队推出的首个开源项目，口号是「Vibe Design meets Figma」。基于 cursor-talk-to-figma-mcp 构建，但在其基础上做了关键增强——不只是让 AI 在 Figma 里操作，而是引导 AI 按照设计最佳实践来构建专业级的设计系统。
cursor-talk-to-figma 给了 AI 一把锤子；Vibma 同时给了一本建筑规范手册。
具体差异体现在：
--edit 等标志控制 AI 可用的工具集，避免不当操作npx -y @ufira/vibma@latest --edit 一键启动（Node.js，不依赖 Bun）设计师需要通过 AI 对话在 Figma 中系统性地构建设计系统——批量创建组件、绑定变量、统一样式规范。特别适合正在从零搭建或大规模重构设计系统的团队。
定位：即插即用的轻量方案，无需任何技术配置
Anthropic 在 Claude.ai 中直接集成的 Figma MCP 连接器，通过 OAuth 认证连接到 Figma 官方的远程 MCP 端点。本质上是 Figma 官方 MCP 远程模式的封装——能力等同，但省去了所有配置步骤。
与 Figma 官方 MCP 远程模式一致：获取设计上下文、截图、变量定义、Code Connect 映射（如已配置）。
零配置：不需要 Node.js、不需要终端操作、不需要编辑 JSON 配置文件、不需要管理 API Key。在 Claude.ai 设置中点击连接 Figma，完成 OAuth 授权即可使用。这对设计师来说是巨大的优势——不是每个设计师都熟悉终端和配置文件。
设计师希望在与 Claude 对话时直接引用 Figma 文件获取设计上下文——分析组件布局、审查规范一致性、基于设计稿生成文档或说明。适合不涉及代码编写的轻量级设计辅助场景。
| 维度 | Figma 官方 MCP | Framelink | cursor-talk-to-figma | Vibma | Claude.ai 连接器 |
|---|---|---|---|---|---|
| 开发者 | Figma | GLips（社区） | sonnylazuardi / Grab | ufira | Anthropic |
| 数据方向 | 读取为主 | 只读 | 双向读写 | 双向读写 | 只读 |
| 核心场景 | Design → Code | Design → Code | AI 操控 Figma | AI 构建设计系统 | 对话中读取设计 |
| 写入能力 | 有限 | 无 | 基础 CRUD | 增强 | 无 |
| 需 Figma 插件 | 桌面版需要 | 否 | 是 | 是 | 否 |
| 需 API Key | OAuth | PAT | 否 | 否 | OAuth |
| 费用 | 远程免费 / 桌面付费 | 免费 | 免费 | 免费 | 免费 |
| 配置难度 | 中等 | 低 | 中等 | 中等 | 零 |
| AI 设计引导 | Skills 系统 | 无 | Prompt 策略 | 运行时警告 | 无 |
| Code Connect | 原生支持 | 不支持 | 不支持 | 不支持 | 支持 |
已有成熟设计系统 → Framelink。描述性数据输出让 AI 用你自己的 Token 和组件来实现。
需要 Code Connect → Figma 官方 MCP。Code Connect 是官方独占功能。
批量操作 → cursor-talk-to-figma。成熟、社区活跃，处理大量重复性设计工作。
对话式构建组件/变量/样式 → Vibma。运行时引导 AI 遵循设计最佳实践。
零配置、轻量使用 → Claude.ai 内置连接器。OAuth 一键连接。
这些工具并不互斥，一个高效的工作流可以是：
本文写于 2026 年 3 月。MCP 生态发展迅速，建议关注各项目的 GitHub 仓库获取最新动态。