AI Agent 直接进 Figma 画布：设计系统终于接进了编码回路
过去设计到开发之间最大的断层，不是模型能力，而是上下文断裂：
- 设计在 Figma 里
- 代码在仓库里
- Agent 常常只能看截图或者零散标注
但最近三个月，这个问题开始真的被打通。
Figma 的关键动作：让 Agent 直接在画布里工作
Figma 在 2026 年 3 月宣布，AI agents 可以通过 use_figma 直接在 Figma 画布中生成和修改原生设计对象。这个动作的意义非常大，因为它不只是“把截图喂给模型”，而是开放了：
- 组件
- Variables
- Auto Layout
- 现有设计系统
- 真实画布结构
这意味着 Agent 第一次能真正理解“团队的设计语法”。
技术上最重要的变化是什么
不是画得更漂亮，而是设计约束进入了 Agent Runtime。
以前的流程：
- AI 看图
- AI 猜结构
- 开发手动对齐设计系统
现在的流程：
- Agent 直接读取设计系统上下文
- 在 Figma 中生成符合组件规则的方案
- 再把同样的结构意图传给编码 Agent
于是设计和代码开始共享同一组事实来源。
为什么这件事对前端和产品团队都重要
1. 设计不再只是参考图
Figma 里的变量、组件、约束都成了真实输入。
2. 代码生成会更稳定
因为 Agent 不再凭截图猜尺寸、猜层级、猜排版。
3. 设计系统终于能“约束”AI
以前大家担心 AI 产出 UI 太散，现在真正可行的解法不是让提示词更长，而是把 design system 本身接进来。
和 vibe coding 的关系
vibe coding 最怕“写得快，但越写越偏”。Figma MCP 这类能力的意义，是给 Agent 一个更硬的参考面。它不是让 vibe coding 失去速度，而是让它有了设计侧护栏。
我的判断
接下来前端 Agent 的分水岭，不是会不会写 React，而是：
它能不能同时理解仓库、浏览器和设计系统。
一旦画布也接入 runtime，Agent 才真正开始拥有“产品上下文”。
来源
- X.com：关于
use_figma和 Agent 进画布的讨论 - Figma 官方博客
- Figma 官方帮助文档