Figma MCP API工具

你是否曾经希望AI能够直接通过Figma API操作设计文件，获取设计内容、管理评论、处理组件和样式？今天要介绍的开源项目Figma MCP API工具，正是为了实现这个目标而设计的。它是一个用于与Figma API交互的MCP服务器，提供了一套完整的Figma API方法。

项目基本信息

一、项目介绍

Figma MCP API工具是一个让AI能够与Figma API交互的MCP服务器。它实现了Figma API的完整方法集，支持文件操作、评论管理、组件样式查询、Webhook管理等。

这个服务器提供了以下类别的工具：

• 用户方法：获取当前用户
• 文件方法：获取文件、文件节点、图像、版本历史
• 评论方法：获取、添加、删除评论及反应
• 团队和项目方法：获取团队项目、项目文件
• 组件方法：获取组件和组件集
• 样式方法：获取样式
• Webhook方法：创建、获取、更新、删除Webhook
• 库分析方法：组件、样式、变量使用分析

二、核心优势

API完整覆盖

实现Figma API的几乎所有方法。

多种认证方式

支持环境变量、命令行参数两种方式。

文件处理

支持获取文件、节点、图像、版本。

评论管理

完整的评论和反应操作。

Webhook支持

支持创建和管理Webhook。

三、适用场景

设计自动化

AI可以读取Figma设计文件，自动化生成代码。

设计系统管理

管理组件、组件集和样式。

设计协作

AI可以自动添加评论和反应。

设计分析

分析组件、样式的使用情况。

四、安装教程

系统要求

安装步骤

第一步：获取Figma API令牌

1. 登录Figma
2. 进入账号设置 -> Personal access tokens
3. 创建新令牌并复制

第二步：克隆项目并构建

git clone https://github.com/thirdstrandstudio/mcp-figma.git
cd mcp-figma
npm install
npm run build

第三步：配置Claude Desktop

找到配置文件，添加：

使用npx（推荐）：

{
  "mcpServers": {
    "figma": {
      "command": "npx",
      "args": ["@thirdstrandstudio/mcp-figma", "--figma-token", "your_figma_api_key"]
    }
  }
}

使用Node.js：

{
  "mcpServers": {
    "figma": {
      "command": "node",
      "args": ["/path/to/mcp-figma/dist/index.js"],
      "env": {
        "FIGMA_API_KEY": "your_figma_api_key"
      }
    }
  }
}

第四步：通过Smithery安装（可选）

npx @smithery/cli@latest install @thirdstrandstudio/mcp-figma --client claude

五、使用示例

示例1：获取当前用户

用户指令：“获取我的Figma用户信息”

AI会调用figma_get_me工具。

示例2：获取Figma文件

用户指令：“获取文件key为abcXYZ123的设计文件”

AI会调用figma_get_file工具：

{
  "fileKey": "abcXYZ123"
}

提示：处理大型文件时使用depth=1限制深度。

示例3：获取评论

用户指令：“获取文件中的评论”

{
  "fileKey": "abcXYZ123",
  "as_md": true
}

示例4：创建Webhook

{
  "event_type": "FILE_UPDATE",
  "team_id": "12345",
  "endpoint": "https://example.com/webhook",
  "passcode": "your_passcode",
  "description": "文件更新通知"
}

示例5：获取组件

{
  "team_id": "12345"
}

六、处理大型文件

在处理大型Figma文件时，建议：

1. 先使用depth=1获取文件结构
2. 根据需要逐步增加深度
3. 使用figma_get_file_nodes获取特定节点

七、常见问题

问题1：API令牌无效

解决方案：检查Figma API令牌是否正确。

问题2：文件未找到

解决方案：确认文件key正确，有访问权限。

问题3：大型文件超时

解决方案：使用depth=1限制，或获取特定节点。

问题4：Webhook创建失败

解决方案：确保端点是HTTPS，passcode正确。

问题5：Node.js版本

解决方案：需要Node.js 16或更高版本。

八、总结

Figma MCP API工具是一个完整的Figma API MCP实现，覆盖了用户、文件、评论、组件、样式、Webhook等所有核心功能。

这个项目的最大价值在于：

1. API完整：实现几乎所有Figma API方法
2. 多种认证：环境变量和命令行参数
3. 功能全面：文件、评论、组件、Webhook
4. 大型文件支持：depth参数控制
5. MIT许可证：可自由使用

如果你需要让AI访问Figma设计数据，Figma MCP API工具是一个非常强大的选择。