Figma版Framelink MCP

🌐 支持语言: 한국어 (韩语) | 日本語 (日语) | 简体中文 | 繁體中文

让您的编程助手访问Figma设计数据
一键实现跨框架设计落地

通过这个模型上下文协议服务器，让Cursor等AI编程工具能够访问您的Figma文件。

当Cursor获取Figma设计数据后，相比截图粘贴等方式，它能更精准地实现一键设计还原。

查看快速入门指南 →

演示视频

观看Cursor结合Figma数据构建UI的演示

工作原理

1. 打开IDE的聊天窗口（如Cursor的代理模式）
2. 粘贴Figma文件/画框/组的链接
3. 让Cursor基于设计文件执行操作（如实现设计）
4. Cursor会从Figma获取元数据并用于编写代码

本MCP服务器专为Cursor优化，在返回Figma API数据前会对响应进行简化和转换，仅保留最相关的布局与样式信息。

精简上下文数据能显著提升AI的准确性和响应相关性。

快速开始

多数代码编辑器通过配置文件管理MCP服务器。

添加以下配置即可启用figma-developer-mcp服务：

注意：需先创建Figma访问令牌，教程参见此文档

MacOS/Linux系统

{
  "mcpServers": {
    "Figma版Framelink MCP": {
      "command": "npx",
      "args": ["-y", "figma-developer-mcp", "--figma-api-key=您的密钥", "--stdio"]
    }
  }
}

Windows系统

{
  "mcpServers": {
    "Figma版Framelink MCP": {
      "command": "cmd",
      "args": ["/c", "npx", "-y", "figma-developer-mcp", "--figma-api-key=您的密钥", "--stdio"]
    }
  }
}

也可在env字段中设置FIGMA_API_KEY和PORT环境变量。

完整配置指南详见Framelink文档。

项目星标历史

了解更多

Figma版Framelink MCP简洁而强大，访问Framelink官网获取进阶技巧。