Cursor 与 Figma 的 MCP 服务器对接

Cursor 与 Figma 的 MCP 服务器对接

通过 Cursor Talk To Figma MCP Server,自动化、分析并以编程方式修改 Figma 文件——让 AI 代理和开发者便捷实现设计自动化。

“Cursor 与 Figma” MCP 服务器能做什么?

Cursor Talk To Figma MCP 服务器为 Cursor AI 开发环境与 Figma 之间搭建了桥梁,实现 AI 助手与设计文件的无缝互动。通过模型上下文协议(MCP)暴露 Figma 的设计数据与操作,该服务器允许开发者和 AI 代理以编程方式读取、分析和修改 Figma 设计。此集成简化了设计师与开发者的工作流,可自动化重复性设计任务、批量内容替换、扩散组件覆盖,并直接通过 AI 工具实现其他自动化能力。该服务器通过标准化 MCP 端点让 Figma 能力触手可及,提升生产力和协作效率。

Prompt 模板列表

仓库或文档中未明确列出 prompt 模板。

资源列表

仓库或文档中未明确提供 MCP 资源列表。

工具列表

仓库或服务器文件中未明确包含 MCP 工具列表。

该 MCP 服务器的应用场景

  • 批量文本内容替换: 自动化替换多个 Figma 设计中的文本内容,减少手动编辑,大幅节省设计团队时间。
  • 实例覆盖批量传播: 自动将组件实例的覆盖从一个源传播到多个目标,简化大型设计系统中的重复更新。
  • 设计自动化: 启用由 AI 驱动的各种 Figma 任务自动化,如样式更新、布局修改或新设计元素生成,直接在开发环境中完成。
  • 将 Figma 集成进 AI 代理: 让 Cursor 内的 AI 代理读取和写入 Figma 文件,实现高级设计分析、点评或快速原型制作。
  • 协同开发与设计: 通过代码程序化访问 Figma 设计,打通开发与设计团队,推动更紧密的集成与更快的反馈循环。

如何设置

Windsurf

  1. 确保已安装 Bun(curl -fsSL https://bun.sh/install | bash)。
  2. 克隆仓库并运行 bun setup 安装依赖。
  3. 启动 WebSocket 服务器:bun socket
  4. 在 Windsurf 配置中添加 MCP 服务器:
    {
      "mcpServers": {
        "cursor-talk-to-figma": {
          "command": "bunx",
          "args": ["cursor-talk-to-figma-mcp"]
        }
      }
    }
    
  5. 保存配置并重启 Windsurf,验证服务器连接。

API 密钥安全存储:

{
  "mcpServers": {
    "cursor-talk-to-figma": {
      "command": "bunx",
      "args": ["cursor-talk-to-figma-mcp"],
      "env": {
        "FIGMA_API_KEY": "${env.FIGMA_API_KEY}"
      },
      "inputs": {
        "apiKey": "${env.FIGMA_API_KEY}"
      }
    }
  }
}

Claude

  1. 安装依赖(Bun)。
  2. 按上述步骤运行 bun setupbun socket
  3. 在 Claude 配置文件中添加 MCP 服务器:
    {
      "mcpServers": {
        "cursor-talk-to-figma": {
          "command": "bunx",
          "args": ["cursor-talk-to-figma-mcp"]
        }
      }
    }
    
  4. 保存并重启 Claude。

API 密钥安全存储:(参见上例)

Cursor

  1. 安装 Bun 并运行 bun setup
  2. 启动 WebSocket 服务器:bun socket
  3. 在 Cursor 配置中添加如下内容:
    {
      "mcpServers": {
        "cursor-talk-to-figma": {
          "command": "bunx",
          "args": ["cursor-talk-to-figma-mcp"]
        }
      }
    }
    
  4. 保存并重启 Cursor,确认 MCP 服务器已激活。

API 密钥安全存储:(参见上例)

Cline

  1. 确保已安装 Bun。
  2. 运行 bun setupbun socket
  3. 在 Cline 配置中添加:
    {
      "mcpServers": {
        "cursor-talk-to-figma": {
          "command": "bunx",
          "args": ["cursor-talk-to-figma-mcp"]
        }
      }
    }
    
  4. 保存,重启 Cline 并验证。

API 密钥安全存储:(参见上例)

如何在流程中使用 MCP

在 FlowHunt 中集成 MCP

要将 MCP 服务器集成进 FlowHunt 工作流,请首先在流程中添加 MCP 组件,并将其连接到你的 AI 代理:

FlowHunt MCP flow

点击 MCP 组件打开配置面板。在系统 MCP 配置区,使用如下 JSON 格式填写你的 MCP 服务器信息:

{
  "cursor-talk-to-figma": {
    "transport": "streamable_http",
    "url": "https://yourmcpserver.example/pathtothemcp/url"
  }
}

配置完成后,AI 代理即可作为工具使用该 MCP,获得其全部功能。请记得将 “cursor-talk-to-figma” 替换为你实际的 MCP 服务器名称,并填写你自己的 MCP 服务器 URL。


概览

部分可用性说明/备注
概览已详述于 readme.md 和项目描述
Prompt 模板列表未发现 prompt 模板
资源列表未明确列出
工具列表未明确列出
API 密钥保护提供了环境变量示例
采样支持(评价时非重点)未见相关说明

该仓库为自动化 Figma 提供了强大的 MCP 集成,但缺乏对 prompt、工具和资源的详细文档。安装指引和应用场景清晰实用,但更深入的 MCP 相关特性(如 roots、采样等)暂无文档支持。


MCP 评分

是否有 LICENSE✅ (MIT)
是否有至少一个工具
Fork 数量433
Star 数量4.4k

观点与评分:
根据以上两张表,该 MCP 服务器评分为 6/10。它 star 数多,活跃度高,安装和集成指引清晰,但缺少明确的 MCP prompt、资源和工具文档,也没有根节点或采样支持的说明。

常见问题

什么是 Cursor Talk To Figma MCP 服务器?

它是一个集成层,把 Cursor AI 开发环境通过模型上下文协议(MCP)连接到 Figma,使 AI 助手和开发者能够以编程方式读取、分析和修改 Figma 设计,实现工作流自动化。

该服务器的主要应用场景有哪些?

主要应用场景包括批量文本内容替换、在设计系统中批量传播实例覆盖、自动化设计任务(如样式或布局更改)、将 Figma 与 AI 代理集成以实现设计分析或快速原型制作,以及打通开发与设计工作流。

如何保护我的 Figma API 密钥?

始终将 FIGMA_API_KEY 存储于环境变量,并在 MCP 服务器配置中的 'env' 和 'inputs' 字段引用,以避免在代码中暴露敏感凭证。

该服务器是否提供 prompt 模板或工具?

仓库或文档中没有提供明确的 prompt 模板、MCP 资源或工具说明,集成主要聚焦通过 MCP 端点访问 Figma 实现自动化。

如何在 FlowHunt 中连接该 MCP 服务器?

将 MCP 组件添加到 FlowHunt 流程中,然后在系统 MCP 配置中填写服务器信息,指定传输方式和服务器 URL,即可让 AI 代理通过 MCP 访问 Figma 功能。

对该 MCP 服务器的总体评价如何?

该服务器健壮、活跃且安装指引清晰,评分为 6/10。但缺乏 MCP prompt、资源及高级功能(如 roots 和采样)的详细文档。

用 AI 优化 Figma 工作流

集成 Cursor Talk To Figma MCP Server,自动化设计任务,加速原型制作,通过 AI 搭建开发与设计团队的桥梁。

了解更多

Figma-Context MCP 服务器
Figma-Context MCP 服务器

Figma-Context MCP 服务器

Figma-Context MCP 服务器通过模型上下文协议(MCP)将 AI 编码代理与 Figma 设计布局连接起来。它使 AI 助手能够获取、分析和理解 Figma 文件,实现无缝的设计到代码工作流、UI 实现、组件提取以及自动化文档生成。...

2 分钟阅读
AI MCP Server +4
BlenderMCP MCP 服务器
BlenderMCP MCP 服务器

BlenderMCP MCP 服务器

BlenderMCP 将 Blender 与 Claude 等 AI 助手连接,通过模型上下文协议(MCP)实现自动化、AI 驱动的 3D 建模、场景创建和资产管理。通过实时、基于提示的自动化与双向 AI 通信,让你的 Blender 工作流程如虎添翼。...

2 分钟阅读
AI 3D Modeling +4
模型上下文协议 (MCP) 服务器
模型上下文协议 (MCP) 服务器

模型上下文协议 (MCP) 服务器

模型上下文协议(MCP)服务器将 AI 助手与外部数据源、API 和服务连接起来,实现复杂工作流的无缝集成,并在 FlowHunt 中安全管理开发任务。...

1 分钟阅读
AI MCP +4