Figma 一年内重建了席位模型、发布远程 MCP 服务器、扩展 Code Connect 与 GitHub 集成,并探索在设计画布上嵌入实时代码,定位从「设计工具」转向「AI 编码 Agent 的上下文层」。
2026 年 4 月,Figma 悄然将其 Professional 方案从每位编辑者每月 $20 降至 $16——这是自 2023 年底 Adobe 以 200 亿美元收购 Figma 告吹、Figma 转而在纽交所上市以来的首次实质性降价。每家关注设计工具的 SaaS 价格追踪平台都发出了同一条标题的某个版本:"Figma 变便宜了。"但这还不是 Figma 今年发生的最值得关注的事。
更具影响力的故事始于十三个月前,与折扣毫无关系。2025 年 6 月至今年 Config 2026 大会期间,Figma 重建了整个席位模型、发布了一个远程 Model Context Protocol 服务器、将 Code Connect 扩展为 GitHub 集成映射工具,并开始尝试将实时代码带入设计画布。将这些发布放在一起看,描述的是一家公司正在重新定位——从"设计师做原型图的工具"转向"让你的 AI 智能体编码工具不再产生设计系统幻觉的上下文层"。这次降价是为这次转型而设计的需求生成策略,而非转型本身。
本文面向从未打开过 Figma(除了拿个十六进制颜色码)的开发者,他们越来越多地被团队中的设计师要求在 Cursor、Claude Code 或 VS Code 中安装"Figma MCP 服务器"。本文将梳理该服务器的实际功能、围绕它重新构建的定价模型、与截图发给聊天机器人相比真正更好的地方,以及——更重要的是——营销页面没有告诉你的关于谁实际上能用到完整版本的信息。
三个相互叠加的独立变化:
席位模型重建(2025 年 3 月)。Figma 砍掉了旧的按产品计费的席位系统——团队单独购买 Figma Design 席位、单独为 Dev Mode 席位付费、单独谈判 FigJam 访问权限。取而代之的是三种席位类型——Full、Dev 和 Collab——每种绑定一组固定的产品。Full 席位包含 Design、Dev Mode、FigJam、Slides、Draw、Sites、Make 和 Buzz。Dev 席位包含 Dev Mode、FigJam、Slides 和 Buzz,外加对 Design 文件的查看/评论权限,面向需要检查但不需要创建的工程师。Collab 席位只有 FigJam 和 Slides,面向相关干系人。根据 Figma 自己的定价和计费更新公告,该政策于 2025 年 3 月 11 日或之后首次续费的账户生效。
Figma 为 Dev Mode 发布了 MCP 服务器(2025 年 6 月),随后又两次扩展。2025 年 6 月 4 日的初始 beta 公告让具身编码工具——文章明确点名了 VS Code 中的 Copilot、Cursor、Windsurf 和 Claude Code——能够直接、结构化地访问 Figma 的设计数据,而非一张位图截图。The Verge 同日对此进行了报道。2025 年 9 月 23 日,Figma 首席技术官 Kris Rasmussen 发布后续公告,宣布远程服务器访问(不再需要本地运行 Figma 桌面应用)、支持 Figma Make 文件,以及 Code Connect 映射的应用内 UI。The Verge 也报道了这条新闻。Figma 于 2026 年 6 月 16 日发布的第三条帖子描述了该服务器"比以往任何时候都更深入地覆盖了整个平台"。
Config 2026 进一步推进:代码作为原生图层类型。根据 Figma 的 Config 2026 管理指南,Figma 在封闭 beta 中引入了"代码图层"——从 GitHub 导入前端代码库并在 Figma 画布上直接编辑其实际代码的能力,同时提供只读的 Dev Mode 时间线,用于检查动画并将其直接导出为 CSS、JSON 或 React。
2026 年 4 月的这次降价是第四个数据点,据行业追踪平台 fewertools 报道,这是对 Penpot 的增长势头和 OpenAI 自身的 Make 风格应用构建推进的明确竞争回应,而非对之前席位价格上涨 25%-33% 的现有客户的优惠。
如果你没有接触过 Figma 的 Dev Mode,核心卖点很简单:不再给 LLM 一张组件的 PNG 并希望它猜对 padding、颜色 token 和变体逻辑,而是让 MCP 服务器直接将结构化数据从 Figma 文件交给智能体。
根据 Figma 的开发者文档,工具表面包括:
get_design_context — 返回选定图层或节点的设计上下文,默认输出 React + Tailwind,但可配置。
get_screenshot — 选区的补充图像,用于在元数据 alone 无法捕捉视觉意图(重叠的图标、作为实时地图嵌入背景的图片)的地方保持布局保真度。
get_metadata — 图层 ID、名称、类型、位置、尺寸;对于 FigJam 文件,还包括节点截图。
create_design_system_rules — 生成一个规则文件,告诉智能体如何将设计翻译为与现有技术栈一致的代码。
add_code_connect_map / get_context_for_code_connect — 将 Figma 节点 ID 链接到代码库中的实际组件,并检索该映射以便智能体引用。
连接方式有两种。远程服务器托管在 https://mcp.figma.com/mcp,根据 Figma 自己的设置指南,所有席位和所有方案(包括免费 Starter 层)都可使用。本地服务器通过 Figma 应用本地运行,需要付费的 Dev 或 Full 席位。任何支持 MCP 的客户端都可以:VS Code、Cursor、Windsurf、Claude Code、Codex,以及 Figma MCP 目录中列出的其他工具。
具体工作流程:设计师使用团队实际的设计系统——真实的变量、真实的组件实例,而非一次性形状——在 Figma 中构建一个组件。开发者(或设计师,或智能体本身)复制该帧的链接。开发者将该链接粘贴到 MCP 连接的编辑器中,并提示"实现这个登录表单"。智能体调用 get_design_context,返回带有实际变量名、间距 token 的 React/Tailwind(或你配置的任何框架)标注,如果 Code Connect 已设置好,还包括要导入的真实组件的文件路径和 prop 签名——而不是编造一个看起来合理的替代品。
还有一个容易被报道忽略的反向方向:根据 MCP 服务器指南,你可以提示智能体在本地启动应用并"在新 Figma 文件中捕获 UI",将实时的、渲染的生产代码转回可编辑的设计图层。这与 Zeplin、Anima 或 Locofy 提供的任何功能都不同——大多数设计转代码工具都是单向的。
两种连接模式并存是有原因的,选错是常见的早期错误。mcp.figma.com/mcp 上的远程服务器是 Figma 文档现在称为"首选"的方式:不依赖桌面应用、可从基于浏览器的客户端使用,而且——根据方案表——向所有席位类型和所有方案开放,包括 Starter。本地服务器通过 Figma 应用本身本地运行,适用于有特定合规或网络要求使得托管端点不可行的组织;Figma 自己的指导明确指出本地路径"主要用于特定场景的企业级组织",大多数团队应该默认使用远程。如果你的团队在两者之间选择,这才是真正的决策轴——不是功能,而是你愿意让设计数据在传输过程中驻留在哪里。
值得精确地说明为什么这在技术上有意义,因为"AI 读取你的 Figma 文件"低估了它。Figma 自己在 2025 年 6 月博客文章中埋没的解释是公告中最有用的部分:当智能体只有截图时,它必须在代码库中搜索匹配的组件,如果找不到高置信度的组件,就会编造一个重复现有代码的新组件。当它有 Code Connect 映射时,Figma 可以将正确现有组件的确切文件路径交给智能体。设计 token 也是如此——截图中的一个红色矩形可能映射到代码库中十几个语义不同的颜色变量中的任何一个;MCP 服务器可以命名文件中实际使用的那个。
这既是 token 效率论据,也是准确性论据。在大型代码库中进行具身搜索以定位"正确的现有 Button 组件"会消耗上下文和墙上时间。直接引用则绕过了那步搜索。Figma 明确表示:提供精确引用"可以使生成的代码更精确、更高效,并减少 LLM token 使用量。"这是一个合法的、可衡量的声明,而非仅仅是营销语言——它映射到任何 RAG 相关系统在用直接指针替换模糊检索时的行为方式。
费用:Dev Mode 本身不再是独立付费附加项——在新方案中已捆绑到 Dev 和 Full 席位,且远程 MCP 服务器在包括免费 Starter 在内的所有方案上均可使用。如果你与 Figma 的唯一交互是"工程师偶尔瞄一眼 Dev Mode",你可能完全不需要为获取基础 MCP 访问而支付任何 Figma 费用。相比旧的"每个编辑器 $25/月 Dev Mode 附加订阅"定价模式,这是一个真实且并非微不足道的改进。
延迟和 token 消耗:如上所述,直接引用胜过智能体的搜索加猜测。如果你的团队已经在"找对现有组件"这个循环上消耗了可观的智能体预算,结构化的设计上下文是一个合法的杠杆,而不仅仅是便利性。
开发者体验:Code Connect 的承诺——生成的代码匹配你实际的设计系统而不是看起来合理的克隆版——是这里提供的最大生活质量改善,前提是你的团队已经维护了严格的组件到设计映射规范。如果没有,工具就没有可映射的内容,就会退化成截图加猜测的基线水平。
锁定:这是真实存在且未被充分讨论的问题。一旦你的团队投入工程时间,为大型设计系统中的每个组件接好 Code Connect 映射,换用 Penpot 或任何其他设计工具就意味着从头重做映射工作。MCP 服务器本身是一个相当通用的协议实现,但其背后的映射数据是 Figma 的专有工具。
安全和数据治理:远程 MCP 服务器意味着设计数据——对许多公司来说,这包括未发布的产品 UI、内部工具布局,有时还有在原型中模拟的真实客户数据——现在通过托管端点流向开发者配置的第三方 AI 客户端。Figma 的文档在我们审查的页面中没有花太多篇幅讨论这个问题;受监管行业的团队应该像对待任何其他接触敏感内部制品的 MCP 集成一样对待它,并对允许哪些智能体和模型调用它进行同样程度的审查。
中大型公司的设计系统团队获得了最清晰的收益:Code Connect 加上 MCP 将"传递一个 Figma 文件并等待开发者解读"变成了一个更短的循环,特别是对于已经在 Storybook 或类似工具中维护组件库的团队。
Figma 在自己的博客文章中引用的 Affirm 报告称,他们使用 MCP 服务器在不到两天的时间内重建了主要产品流程,将其开发速度描述为"数量级"的提升——这是来自署名客户的强烈声明,但它是 Figma 自己的案例研究,应该这样阅读而不是作为独立基准。
免费或 Professional 方案的个人开发者和小团队获得基础能力——get_design_context、get_screenshot、get_metadata——但没有 Code Connect 的代码库感知代码片段。仍然明显优于截图,但智能体是在生成看似合理的代码而不是引用你实际的组件。
反向捕获——将运行中应用的实时 UI 转换为可编辑的 Figma 图层——对那些先用代码原型再设计的团队,或者第一次将现有无文档产品纳入设计系统的团队很有用。
Code Connect——这个真正让生成的代码匹配你代码库的功能——需要 Organization 或 Enterprise 方案,而不是 Professional。这在三个地方独立确认:Figma 的方案和功能对比表、其专门的 Code Connect 帮助文章,以及公开的 figma/code-connect GitHub 仓库,后者明确说明:"Code Connect 在 Organization 和 Enterprise 方案上可用,需要完整的 Design 或 Dev Mode 席位才能使用。"Organization 起价约每个 Full 席位每月 $55,Enterprise 约 $90,而 Professional 是 $16——解锁这个真正将本产品与向 ChatGPT 粘贴截图区分开来的功能,需要三倍半到近六倍的价格跳跃。$16 的宣传价格让你获得 MCP 服务器的基础工具;但不会让你获得发布博客文章花最多篇幅解释的那个功能。
席位升级计费陷阱是真实存在且自动触发的。如果持有更便宜 Dev 或 Collab 席位的人开始编辑 Design 文件——这是 Figma 自己的席位定义明确限制这些席位类型执行的操作——系统会提示自动升级到 Full 席位,静默改变他们的月费(从 Professional 的 $3 或 $12 升至 $16,或从 Organization 的 $5/$25 升至 $55,按当前公布费率)。访问变更自动计费。团队需要主动设定预期,或者在收到发票时才发现。
有一个很容易被忽略的硬性迁移截止日期。根据 figma/code-connect 仓库的说法,特定框架的 Code Connect 解析器将在 2026 年 8 月 17 日停止接收更新和支持——距本文发布仅五天。使用旧版基于解析器的方式为 React、Storybook、SwiftUI 或 Jetpack Compose 设置 Code Connect 的团队需要迁移到模板文件——Figma 更新且现在是唯一维护的方式——使用其发布的迁移指南。如果你的团队较早采用了 Code Connect 且此后未触碰过该设置,现在就值得检查,而不是等到某些东西悄无声息地停止更新之后。
没有人公开基准测试过远程服务器便利性的数据流成本。当使用推荐的远程端点时,设计上下文默认会离开你的基础设施,而不是通过桌面服务器保留在本地。对大多数团队来说这不是问题;但对于任何处于更严格合规制度下的人来说,这改变了采用 Figma 推荐的"首选"设置路径的风险考量。
Figma 的 MCP 和 Code Connect 技术栈解决了一个真正令人头疼的问题——AI 智能体从平面图像中猜测设计系统——其底层工程论证(结构化引用优于模糊搜索)也站得住脚。然而,这并非价格下调标题所暗示的中立开发者工具故事。该公司大约在构建这一功能集的同时,围绕席位类型重新调整了整个计费模式,然后将使 AI 输出真正可信的那部分功能(即 Code Connect)放在了最贵的两个套餐之后,同时将最便宜套餐的价格下调——而此时 Penpot 等竞争对手正在崛起。不怀好意地解读:16 美元的 Professional 价格是一个漏斗,Code Connect 才是追加销售。善意解读:Figma 正确识别到免费/低价的基准访问能在更庞大的开发者群体中推动 MCP 的普及和使用习惯的养成,而需要最深度集成的团队——拥有成熟设计系统的大型组织——无论怎样都会成为 Organization 或 Enterprise 客户。
两种解读可能同时成立。毫无疑问的是,Figma 不再只凭借画布功能与 Sketch 和 Penpot 竞争。它现在还要与开发者可能安装的其他所有 MCP 服务器争夺——文档服务器、数据库模式服务器、工单追踪服务器——以争取在日益拥挤的上下文窗口中占有一席之地。它能否赢得这个位置,完全取决于你的团队的 Figma 文件是否构建得足够好——拥有真正的组件和命名变量——值得让 AI 智能体去指向它。一个混乱的 Figma 文件产生混乱的结构化上下文,其可靠程度与产生混乱的截图一模一样。
谁应该现在尝试,谁应该等待,谁应该忽略它
如果你的团队已有严格规范管理的 Figma 设计系统,包含命名变量和组件库,且使用(或可以论证使用)Organization 或 Enterprise 套餐——Code Connect 加上 MCP 服务器很可能显著减少设计交接与代码上线之间的来回沟通。
如果你是独立开发者或没有正式设计系统的小团队——试试免费套餐,不必升级——远程 MCP 服务器的基准工具在任何计划下都是免费的,而且确实比截图更好,但在没有 Code Connect 的情况下不要期待代码库匹配的魔力。
如果你的团队在设计或产品数据流向方面受到合规约束,请等待——直到你专门审查了远程服务器的数据处理方式,以及与本地运行桌面服务器的比较。
如果你的 Figma 使用量很少,组件都是一次性且不一致的,或者你的团队已经从当前使用的 AI 智能体的截图工作流程中获得了同等价值——忽略它。Code Connect 没有什么可以映射到一个尚未真正存在的设计系统上,而你支付 Organization 价格却买到了一个没有基底支撑的功能。
讨论:如果你已经将 Figma 的 Code Connect 连接到一个真正的设计系统上,Token/准确率的提升是否比基于截图的提示在实际中可衡量地减少了团队的工作量,还是维护映射最新状态带来的负担抵消了收益——这种权衡与你团队使用竞争方案(如 Storybook 驱动的 MCP 服务器或向 AI 智能体提供的纯组件库文档)的经验相比如何?
Introducing our Dev Mode MCP server: Bringing Figma into your workflow
Design context, everywhere you build
Updates to Figma's pricing, seats, and billing experience
Figma plans and features comparison
Code Connect 帮助文章
Guide to the Figma MCP server
Figma MCP server: tools and prompts
Config 2026: a guide for admins
figma/code-connect on GitHub
Figma will let your AI access its design servers - The Verge
Figma made its design tools more accessible to AI agents - The Verge
Figma cut Professional from $20 to $16/editor/month - fewertools Pulse
Figma Pricing in 2026: Seats, Plans, and What You Actually Pay