Figma Context MCP

io.github.GLips由 GitHub 账号 GLips 发布v0.13.2更新于 Oct 24, 2026

Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.

发布方自己的服务:Figma MCP Server

已验证STDIO仅桌面开发者工具媒体与设计

概览

AI 生成的概览

一个本地 MCP 服务器,让编程助手获取 Figma 文件数据,从而把设计实现为代码。

可以做什么
根据粘贴的 Figma 链接获取文件、画板或分组数据,并简化为模型可用的布局与样式上下文。把 Figma 上下文转化为代码,在任意框架中实现设计。减少发送给模型的上下文量,使回答更准确、更相关。
适用场景
适用于在 Cursor 等 AI 编程编辑器中使用,希望助手依据真实 Figma 设计而非截图来构建界面的场景。
运行要求
通过 stdio 在本地运行,通常用 npx 启动,需要 Node.js。需要 Figma 个人访问令牌,通过 FIGMA_API_KEY 或命令行参数提供。需要访问 Figma API 的网络连接。
安装前请注意
Figma 个人访问令牌属于机密,避免写入共享配置文件或提交到版本控制。服务器会读取你的 Figma 设计数据,并发送给 Figma API 及所连接的模型。

安装

在 SourceWeft 中

  1. 打开 控制台中的 Figma Context MCP,将其添加到工作区。
  2. 为需要使用其工具的对话启用该服务。

Desktop only,通过 STDIO。 STDIO 服务会启动本地进程,因此需要 SourceWeft 桌面宿主。

其他 MCP 客户端

参照 仓库 中的启动说明。

README

[Framelink]

Framelink MCP for Figma

Give your coding agent access to your Figma data.
Implement designs in any framework in one-shot.

[weekly downloads] [MIT License] [Discord]
[Twitter]

Give Cursor and other AI-powered coding tools access to your Figma files with this Model Context Protocol server.

When Cursor has access to Figma design data, it's way better at one-shotting designs accurately than alternative approaches like pasting screenshots.

See quickstart instructions →

Demo

Watch a demo of building a UI in Cursor with Figma design data

[Watch the video]

How it works

  1. Open your IDE's chat (e.g. agent mode in Cursor).
  2. Paste a link to a Figma file, frame, or group.
  3. Ask Cursor to do something with the Figma file—e.g. implement the design.
  4. Cursor will fetch the relevant metadata from Figma and use it to write your code.

This MCP server is specifically designed for use with Cursor. Before responding with context from the Figma API, it simplifies and translates the response so only the most relevant layout and styling information is provided to the model.

Reducing the amount of context provided to the model helps make the AI more accurate and the responses more relevant.

Getting Started

Many code editors and other AI clients use a configuration file to manage MCP servers.

The figma-developer-mcp server can be configured by adding the following to your configuration file.

NOTE: You will need to create a Figma access token to use this server. Instructions on how to create a Figma API access token can be found here.

MacOS / Linux

json
{  "mcpServers": {    "Framelink MCP for Figma": {      "command": "npx",      "args": ["-y", "figma-developer-mcp", "--figma-api-key=YOUR-KEY", "--stdio"]    }  }}

Windows

json
{  "mcpServers": {    "Framelink MCP for Figma": {      "command": "cmd",      "args": ["/c", "npx", "-y", "figma-developer-mcp", "--figma-api-key=YOUR-KEY", "--stdio"]    }  }}

Or you can set FIGMA_API_KEY and PORT in the env field.

If you need more information on how to configure the Framelink MCP for Figma, see the Framelink docs.

Star History

[Star History Chart]

Learn More

The Framelink MCP for Figma is simple but powerful. Get the most out of it by learning more at the Framelink site.

来源:README.md,提交 c083d65

工具

0
SourceWeft 尚未在沙箱中启动过该软件包,因此其工具未知。

版本历史

1
  1. v0.13.2最新Sep 16, 2026

评分

已满足适用检查项的 50%

该评分衡量此收录条目的完整程度,依据注册中心条目、端点与公开来源计算得出。它不是对服务器本身的评价,也不表示服务器安全或当前可用:可连通性是带日期的检查结果,评分也不包含安装量或用户评价。

  • 近 30 天内可连通25 分

    请保持端点能够响应 MCP 握手;SourceWeft 每 30 天探测一次。

  • 已声明认证方式10 分

    请在注册中心条目中声明凭据请求头,或保持端点能够响应探测,以便判定其认证方式。

  • 已列出工具15 分

    请让服务器在无凭据时响应 tools/list,或发布可在沙箱中无凭据启动的软件包。

  • 描述必需15 分
  • 图标10 分
  • 文档15 分
  • 许可证10 分

其他 Figma 集成