Cursor Talk to Figma MCP

基本能力

产品定位

Cursor Talk to Figma MCP 是一个用于连接 Cursor AI 和 Figma 的中间件，旨在通过编程方式实现设计自动化。

核心功能

1. 文档与选择：获取 Figma 文档信息、选择节点信息等。
2. 注释管理：创建、更新和管理注释，支持批量操作。
3. 元素创建：创建矩形、框架、文本等设计元素。
4. 文本修改：批量修改文本内容，支持智能分块处理大型设计。
5. 样式设置：设置填充颜色、描边颜色、圆角半径等样式。
6. 布局与组织：移动、调整大小、删除、克隆节点等。
7. 组件与样式：获取和管理组件、样式信息。
8. 导出与高级操作：导出节点为图像，执行 Figma 代码等。
9. 连接管理：通过 WebSocket 连接 Figma 插件。

适用场景

1. 设计自动化：批量修改文本、样式等设计元素。
2. 设计协作：通过注释和编程方式实现团队协作。
3. 设计验证：通过编程方式验证设计的一致性和正确性。
4. 设计导出：批量导出设计元素为图像或其他格式。

工具列表

1. Document & Selection：get_document_info, get_selection, get_node_info, get_nodes_info
2. Annotations：get_annotations, set_annotation, set_multiple_annotations, scan_nodes_by_types
3. Creating Elements：create_rectangle, create_frame, create_text
4. Modifying text content：scan_text_nodes, set_text_content, set_multiple_text_contents
5. Styling：set_fill_color, set_stroke_color, set_corner_radius
6. Layout & Organization：move_node, resize_node, delete_node, delete_multiple_nodes, clone_node
7. Components & Styles：get_styles, get_local_components, get_team_components, create_component_instance
8. Export & Advanced：export_node_as_image, execute_figma_code
9. Connection Management：join_channel

常见问题解答

1. 如何连接 Figma 插件？：通过 WebSocket 服务器连接，使用 join_channel 命令。
2. 如何批量修改文本？：使用 set_multiple_text_contents 工具。
3. 如何导出设计元素？：使用 export_node_as_image 工具。

使用教程

使用依赖

1. 安装 Bun：

curl -fsSL https://bun.sh/install | bash

安装教程

1. 运行安装脚本：

bun setup

1. 启动 WebSocket 服务器：

bun socket

1. 启动 MCP 服务器：

bunx cursor-talk-to-figma-mcp

1. 安装 Figma 插件：
2. 在 Figma 中，转到 Plugins > Development > New Plugin
3. 选择 "Link existing plugin"
4. 选择 src/cursor_mcp_plugin/manifest.json 文件

调试方式

1. 启动 WebSocket 服务器：

bun socket

1. 在 Cursor 中安装 MCP 服务器。
2. 在 Figma 中运行 Cursor MCP 插件。
3. 使用 join_channel 连接插件到 WebSocket 服务器。
4. 使用 Cursor 通过 MCP 工具与 Figma 通信。

许可证

该项目遵循 MIT 开源许可条款，请参阅 MIT 了解完整条款。