Skip to main content
Glama

Figma MCP Server

Figma MCP 服务器

一个ModelContextProtocol服务器,使 AI 助手能够与 Figma 文件交互。该服务器提供直接通过 ModelContextProtocol 查看、评论和分析 Figma 设计的工具。

特征

  • 通过提供 URL 将 Figma 文件添加到与 Claude 的聊天中
  • 阅读并发布 Figma 文件的评论

与 Claude 一起设置

  1. claude.ai/download下载并安装 Claude 桌面应用程序
  2. 获取 Figma API 密钥(figma.com -> 点击左上角您的姓名 -> 设置 -> 安全)。授予File contentComments范围。
  3. 配置 Claude 使用 Figma MCP 服务器。如果这是您的第一个 MCP 服务器,请在终端中运行以下命令。
echo '{ "mcpServers": { "figma-mcp": { "command": "npx", "args": ["figma-mcp"], "env": { "FIGMA_API_KEY": "<YOUR_API_KEY>" } } } }' > ~/Library/Application\ Support/Claude/claude_desktop_config.json

如果不是,请将figma-mcp块复制到你的claude_desktop_config.json

  1. 重新启动 Claude Desktop。
  2. 在 Claude 的界面中查找带有可用工具数量的锤子图标,以确认服务器正在运行。

示例用法

使用 claude 桌面开始新的聊天并粘贴以下内容

What's in this figma file? https://www.figma.com/design/MLkM98c1s4A9o9CMnHEyEC

更实际的用法演示

https://www.loom.com/share/0e759622e05e4ab1819325bcf6128945?sid=bcf6125b-b5de-4098-bf81-baff157e3dc3

开发设置

与 Inspector 一起运行

您可以使用 MCP Inspector 工具进行开发和调试。该工具提供了一个可视化界面,用于测试和监控 MCP 服务器的交互。

访问Inspector 文档以获取详细的设置说明和使用指南。

使用 Inspector 进行本地测试的命令是

npx @modelcontextprotocol/inspector npx figma-mcp

本地开发

  1. 克隆存储库
  2. 安装依赖项:
npm install
  1. 构建项目:
npm run build
  1. 对于自动重建的开发:
npm run watch

可用工具

该服务器提供以下工具:

  • add_figma_file :通过提供其 URL 将 Figma 文件添加到您的上下文中
  • view_node :获取 Figma 文件中特定节点的缩略图
  • read_comments :获取 Figma 文件上的所有评论
  • post_comment :在 Figma 文件中的节点上发表评论
  • reply_to_comment :回复 Figma 文件中的现有评论

每个工具都旨在通过 ModelContextProtocol 接口提供与 Figma 文件交互的特定功能。

Deploy Server
A
security – no known vulnerabilities
F
license - not found
A
quality - confirmed to work

remote-capable server

The server can be hosted and run remotely because it primarily relies on remote services or has no dependency on the local environment.

使 AI 助手能够通过 ModelContextProtocol 与 Figma 文件进行交互,从而允许直接在聊天界面中查看、评论和分析 Figma 设计。

  1. 特征
    1. 与 Claude 一起设置
      1. 示例用法
        1. 更实际的用法演示
          1. 开发设置
            1. 与 Inspector 一起运行
            2. 本地开发
          2. 可用工具

            Related MCP Servers

            • A
              security
              F
              license
              A
              quality
              Enables seamless interaction with Figma via the Model Context Protocol, allowing LLM applications to access, manipulate, and track Figma files, components, and variables.
              Last updated -
              145
              138
              • Apple
            • A
              security
              F
              license
              A
              quality
              A Model Context Protocol server that provides access to Figma API functionality, allowing AI assistants like Claude to interact with Figma files, comments, components, and team resources.
              Last updated -
              18
              261
              3
            • A
              security
              F
              license
              A
              quality
              A Model Context Protocol server that integrates with Figma's API, allowing interaction with Figma files, comments, components, projects, and webhook management.
              Last updated -
              5
              623
            • -
              security
              F
              license
              -
              quality
              A Model Context Protocol server that connects AI tools and LLMs to Figma designs, enabling them to extract design data, analyze design systems, and generate development documentation.
              Last updated -
              145
              2
              • Apple

            View all related MCP servers

            MCP directory API

            We provide all the information about MCP servers via our MCP API.

            curl -X GET 'https://glama.ai/api/mcp/v1/servers/MatthewDailey/figma-mcp'

            If you have feedback or need assistance with the MCP directory API, please join our Discord server