Figma 的 MCP Server 今天有了重大更新：
* **以前的 MCP 功能：** 主要侧重于 **“读”**（Read）。AI 扫描你的设计稿，告诉你这里用了什么颜色、什么组件，然后帮你写出对应的 CSS 或 React 代码。它像是一个**翻译官**。
* **现在的新能力：** 重点在于 **“写”**（Write）。通过 `use_figma`，AI 拥有了**修改权限**。你给它一段代码，它能反向在 Figma 里画出对应的组件；或者你直接在命令行里下指令，让它帮你把整个页面的间距调对。它现在是你的**设计助理**。
以下是官方博客内容。
## Agent，欢迎来到 Figma 画布
作者：Matt Colyer，Figma 产品总监
我们正在快速优化 Figma 对 AI Agent（智能体）的支持。此功能最终将成为按量计费的付费功能，但在 Beta 测试期间可免费使用。
从配色方案、按钮内边距到字体排版和交互设计，这些设计决策始终定义着产品的形态。无论决策多么细微，积少成多后，它们便成就了产品独特的体验。直到今天，AI Agent 往往缺乏这些背景信息，这也是为什么 AI 生成的设计总是让人感觉陌生且平庸。
借助于 [Figma 的 MCP Server ](http://t.cn/AXf1Bh0v )，Agent 现在可以**直接向你的 Figma 文件执行写入操作**，延续你长期以来精心建立的设计标准。通过 `use_figma` 工具，Claude Code、Codex 以及其他支持 MCP 协议的客户端可以生成并修改与你的设计系统相关联的设计资产。无论产品工作是从代码 Agent、Figma 还是命令行开始，Figma 都是所有创意汇聚的焦点。
“OpenAI 的团队使用 Figma 进行迭代、微调，并对产品结合方式做出决策，”Codex 的设计负责人 Ed Bayes 表示。“现在，Codex 可以直接在 Figma 中寻找并使用所有关键的设计上下文，帮助我们更高效地构建高质量产品。”
你可以在代码与画布之间流畅切换，让 Agent 在共享的上下文环境中运行。而“技能（Skills）”——一组以 Markdown 文件形式编写的指令——现在能直接塑造 Agent 在 Figma 画布上的构建方式。这种专业经验引导着每一份输出，如今其价值比以往任何时候都更加凸显。
视频2：你现在可以通过 `use_figma` 工具指引 Agent 创建或更新 Figma 文件及组件。
## 用“技能”指导你的 Agent
向 AI Agent 开放画布意味着它们获得了进入你设计系统和文件的权限。而**“技能（Skills）”**定义了 Agent 如何行使这些权限。它们概述了在 Figma 中执行工作流的方式：采取哪些步骤、遵循什么顺序、遵守哪些规范。除了流程本身，技能还确保了 Agent 拥有必要的专业知识和背景，从而产出稳定、符合品牌调性的设计——并且知道什么是“好设计”。它们填补了认知鸿沟，让 Agent 真正懂得如何在 Figma 中工作。
“最优秀的产品源于对细节极致关注的团队，”Claude Code 产品负责人 Cat Wu 说道。“许多设计团队在 Figma 中打磨作品，并用 Claude Code 将其变为现实。‘技能’教导 Claude Code 直接在设计画布中工作，这样你构建产品的方式就能始终忠于团队的意图和判断。”
任何人都可以编写“技能”，且不需要开发插件或编写复杂代码。今天发布的多个技能示例均来自社区实践者。其核心是一个基础技能 `/figma-use`，所有其他技能都建立在它之上。它赋予 Agent 对 Figma 运作方式（从结构到核心原则）的通用理解。团队可以基于此进行定制和迭代。
以下是你可以立即探索的 9 个[示例技能](http://t.cn/AXf136yK )：
- `/figma-generate-library`：基于代码库在 Figma 中创建新组件
- `/figma-generate-design`：使用现有组件和变量在 Figma 中创建新设计
- `/create-voice`：从 UI 规范中生成屏幕阅读器规范（VoiceOver, TalkBack, ARIA）
- `/cc-figma-component`：从结构化 JSON 协议生成 Figma 组件
- `/apply-design-system`：将现有设计连接到系统组件
- `/rad-spacing`：使用变量和回退方案应用层级间距
- `/edit-figma-design`：使用 Warp 和 Oz 编排 Figma 设计工作流
- `/sync-figma-token`：同步代码与 Figma 变量间的设计 Token，并具备偏差检测功能
- `/multi-agent`：运行并行工作流并在 Augment 中实现设计
视频3：我们的内置技能向 Agent 展示了如何在 Figma 画布上进行操作。
技能不仅定义了你如何与 Agent 协同构建，还通过“自愈循环（Self-healing loops）”塑造了输出的精细度。当 Agent 生成一个屏幕界面时，它可以截图并针对不匹配的部分进行迭代。由于它操作的是真实的结构、组件、变量和自动布局（Auto Layout），这些调整是与系统本身发生交互，而非仅仅是视觉上的修补。
AI 模型本质上是非确定性的。技能通过固化特定的步骤和指南，使 AI 的行为更具可预测性。你的设计规范不再是静态的文档，而是 Agent 工作时必须遵守的规则。
视频4：从代码构建设计，并实时连接到你的 Figma 设计系统。
由于该能力原生集成在 Figma MCP Server 中，它在享受 Figma 安全性和可靠性的同时，还通过插件 API 开放了对 Code Connect、Figma Draw 和 FigJam 的访问权限。技能也为 Figma 社区提供了一条更快速、更易用的路径，以便大家分享成果或创建个性化解决方案。
展望未来，我们将扩展 Agent 在 Figma 中的能力——通过原生 AI 功能让画布更强大，并使技能的调用和分享更简单。我们还将持续增加功能（如支持图片和自定义字体），力求与插件 API 的能力齐平。
阅读我们的 [Figma MCP Server 指南](http://t.cn/AXf136yC )开始使用，或通过[开发者文档](http://t.cn/AXf136yY )学习如何创建技能。我们迫不及待想看到你与 Agent 共同设计和构建的成果。
我们对这一功能将带来的设计未来感到兴奋。自两周前启动“从代码到画布”的扩展以来，我们已经看到它在内部解锁了全新的工作方式。虽然这最终将是一个付费 API，但在 Beta 期间我们将免费提供。目前它已支持 Augment、Claude Code、Codex、Copilot CLI、VS Code Copilot、Cursor、Factory、Firebender 和 Warp 等 MCP 客户端。
