一、Figma MCP 介绍
Figma MCP(Model Context Protocol)是基于Anthropic开放标准协议的Figma服务,通过它,Cursor等AI编程工具能直接读取Figma的组件、布局和样式数据,精准将设计稿转化为高质量前端代码,无需截图即可实现“设计到代码”的无缝转化。
官方文档 developers.figma.com/docs/figma-…
二、cursor安装流程
-
安装 figma 插件
打开 cursor settings > Plugins
在 marketplace 里搜索
figma并安装 -
配置 mcp 服务
点击 Figma MCP server deep link,会在cursor 打开 MCP配置
点击
Install安装点击
Connect,会跳转figma授权页,需要进行登录登录完成会进入授权页
点击
Agree同意,安装完全
三、使用
点击Plugins的figma插件的Try in Chat,ai助手会介绍figma MCP,以及提供 figma链接可以生成代码