Figma 推出官方 MCP 服务
- 采用 SEE 模式免除繁琐配置
- 能比非官方的 MCP 获取更多详细设计稿信息和素材
下面是详细介绍和使用方法
官方的 MCP 会传输以下信息：
- 通过提供组件、变量、样式等元数据，减少 LLM 的搜索和推理负担，提高代码生成的准确性和效率。
- 用高层次的设计截图补充元数据，帮助 LLM 理解整体结构、页面流转和响应式布局等。
- 提供伪代码或实际代码示例，描述设计中定义的交互行为。
- 从设计中提取文本、SVG、图片、图层名、注释等内容，帮助 LLM 理解界面数据模型和填充逻辑。
如何使用：
"mcpServers": {
"Figma": {
"url": "http://127.0.0.1:3845/sse"
}
}
- 更新 Figma 客户端到最新版
- 在左上角，打开 Figma 菜单，进入 Preferences，启用 Dev Mode MCP Server
- 固定的 MCP 地址是 http://127.0.0.1:3845/sse
- 在Trae Cursor 或 Chatwise 中正常设置 MCP
- 直接在 Figma 中选择一个页面或复制画板链接给软件让其实现
