首页
学习
活动
专区
圈层
工具
发布
MCP广场 >详情页
Moonray Figma解析器2026-10-22342分享添加福利群:解决AI开发者的「MCP实战痛点」
通过提取节点层次结构,促进对Figma文件结构的分析,可通过REST API或MCP协议访问。
By moonray
2026-10-22342
github
详情内容

Figma MCP 服务器

一个用于分析 Figma 文件结构的 MCP(模型上下文协议)服务器。

功能

  • 分析 Figma 文件以提取节点层次结构
  • 支持 REST API 和 MCP 协议
  • 可配置的节点树深度

先决条件

  • Node.js 16+
  • npm 或 yarn
  • 一个 Figma API 密钥

安装

从 npm 安装

npm install -g figma-mcp-server

从源码安装

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

配置

复制示例环境文件并添加您的 Figma API 密钥:

cp .env.example .env

然后编辑 .env 文件并添加您的 Figma API 密钥:

FIGMA_API_KEY=your_figma_api_key_here

您可以从 Figma 账户设置中获取 Figma API 密钥:https://www.figma.com/developers/api#access-tokens

使用

作为 REST API 服务器

启动服务器:

npm start

这将在端口 3000(或您在 .env 文件中指定的端口)上启动一个 Express 服务器。

API 端点

  • GET /health - 健康检查端点
  • GET /openapi.json - OpenAPI 规范
  • GET /mcp.json - MCP 清单
  • POST /analyze - 分析 Figma 文件

对分析端点的示例请求:

curl -X POST http://localhost:3000/analyze \
  -H "Content-Type: application/json" \
  -d '{"figmaUrl": "https://www.figma.com/file/FILE_ID/PROJECT_NAME?node-id=NODE_ID", "depth": 2}'

作为 MCP 服务器

该服务器可以通过 MCP 协议直接被 LLM 使用:

figma-mcp-server --cli

或者如果从源码运行:

npm run start -- --cli

客户端示例

包含了一个简单的客户端示例。要使用它:

node client-example.js https://www.figma.com/file/FILE_ID/PROJECT_NAME?node-id=NODE_ID 2

最后一个参数是可选的深度参数。

开发

在开发模式下运行

npm run dev

测试

npm test

Docker

提供了一个 Dockerfile 用于容器化部署:

docker build -t figma-mcp-server .
docker run -p 3000:3000 --env-file .env figma-mcp-server

许可证

MIT

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档