mcpField
F
Figma MCP

Figma MCP

本地服务
scalably.io媒体与设计07 周前更新

关于 Figma MCP

Figma MCP 为设计和开发工作流提供 Figma REST API 数据访问。它可列出文件的顶层画框,并将选定画框的 PNG、节点 JSON 和图片填充映射保存到本地。

主要功能

  1. 01列出并筛选 Figma 顶层画框
  2. 02查看画框名称、ID、尺寸和页面
  3. 03获取画框渲染后的 PNG
  4. 04保存节点 JSON 和规范化图片填充数据
  5. 05将获取的文件限制在配置的输出目录内

适用场景

  1. 01查看 Figma 文件中可用的画框
  2. 02获取画框图像和结构化节点数据
  3. 03将画框资源保存到本地以便后续检查

MCP 相关

向 MCP 客户端提供两个工具:一个列出顶层画框,另一个获取画框并将 PNG 和 JSON 数据写入本地输出目录。服务使用 Figma 个人访问令牌。

配置

本地服务的配置在各客户端中通用,复制后粘贴到客户端的 MCP 配置文件即可。

暂未收录安装方式

我们还没有获取到这个服务的安装包或远程地址,请按项目 README 中的说明安装。

代码仓库
安装包
npm@scalably-io/figma-mcp1.0.1
mcpbfigma-mcp.mcpb

工具

2

收录的工具列表 · 更新于 2 周前

参数类型必填说明
querystring否可选,不区分大小写的页面或框架名称子字符串。
file_keystring是从 Figma URL 解析出的文件 key。

详细介绍

Figma MCP

Figma REST API MCP 服务。提供 2 个工具,用于列出文件中的顶层框架,并将一个框架渲染后的 PNG、其节点 JSON 和图像填充映射保存到本地输出目录。

安装

Claude Code:

claude mcp add figma -e FIGMA_TOKEN=your-token -- npx -y @scalably-io/figma-mcp

Codex:

codex mcp add figma --env FIGMA_TOKEN=your-token -- npx -y @scalably-io/figma-mcp

Claude Desktop:从最新的 GitHub release 下载 figma-mcp.mcpb 并打开。

设置

  1. 在 figma.com 的账户设置中创建个人访问令牌,并授予 file_content:read 权限范围。
  2. 在任意 Figma 文件 URL 中找到文件键:它是 /design/ 或 /file/ 后面的部分。例如,https://www.figma.com/design/AbC123xyz/My-file 对应 AbC123xyz。两个工具都将其作为 file_key。
  3. 如果未设置 FIGMA_TOKEN,服务仍会启动并列出其工具;此时每次调用都会失败,并返回 FIGMA_NOT_CONFIGURED,直到提供令牌。
  4. fetch_frame 是唯一会写入文件的工具(因此不会标记为只读);它会将 frame.png、node.json 和 fills.json 写入已配置输出根目录下的目录(默认为 ./figma-output)。另一个工具完全只读。

工具(2 个)

工具功能
list_frames列出 Figma 文件中的所有顶层 FRAME 节点,并可按精确页面名称、节点 ID、尺寸和文件元数据进行筛选
fetch_frame获取一个 Figma 框架,并以事务方式将 frame.png、node.json 和标准化图像填充映射写入输出根目录下的目录

配置

变量必需用途
FIGMA_TOKEN是具有 file_content:read 权限范围的 Figma 个人访问令牌
FIGMA_API_BASE_URL否覆盖 Figma REST API 基础 URL(默认为 https://api.figma.com/v1)
FIGMA_REQUEST_TIMEOUT_MS否每次请求的超时时间,单位为毫秒(默认为 60000)
FIGMA_MAX_JSON_BYTES否Figma JSON 响应的字节数上限(默认为 104857600)
FIGMA_MAX_FRAME_BYTES否下载的框架 PNG 的字节数上限(默认为 104857600)
FIGMA_OUTPUT_ROOT否每个 fetch_frame 输出目录必须位于其下的目录(默认为 ./figma-output,首次使用时创建)
FIGMA_ALLOW_HTTP_FOR_TESTS否仅供测试套件使用:1 允许使用纯 HTTP 环回 API 基础 URL。正常使用时切勿设置

响应格式

每个工具都返回普通 JSON,包含 status(succeeded、partial、no_op)、summary、target、result、proof、warnings 和 recovery。失败时会抛出普通错误字符串:<code>: <message> <hint>。

限制

fetch_frame 通过 Figma 的图像 API 进行渲染,因此超大框架或极端缩放值可能会超过已配置的 JSON 或框架字节数限制;遇到这种情况时,请降低 scale 或拆分框架。fills.json 中的 URL 是临时的,会在 14 天内过期。

验证

每个 release 都会在 CHANGELOG.md 中列出软件包版本、.mcpb 的 sha256,以及其派生自的生产提交。CI 会在每次推送时运行测试,并对打包后的 tarball 执行全新安装。

隐私政策

此服务在你的设备上本地运行,并使用你自己的凭据。它不会收集个人数据,不包含遥测功能,除你明确获取的框架包外不会持久存储任何内容,并且只会与其封装的供应商 API 通信。包括 Scalably 在内的任何第三方都不会收到你的数据。联系方式:[email protected]。规范版本:https://scalably.io/connector-privacy.html

许可证

MIT。版权所有:Scalably。

评论

支持 Markdown

第一次接触 MCP?

从协议是什么,到在客户端里装上第一个服务,这几条回答覆盖了大多数入门问题。

一个开放协议,规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话,MCP 服务负责提供工具、资源和提示模板,两者通过标准消息通信,同一个服务可以被不同客户端复用。