Figma MCP Server

io.github.planetabhi由 GitHub 帳號 planetabhi 發布v3.1.3更新於 Nov 3, 2026

A local MCP server with full Figma REST API coverage.

發布方自己的服務：Figma MCP Server

已驗證STDIO僅桌面開發者工具資料與分析媒體與設計

概覽

AI 產生的概覽

本機 MCP 伺服器，把 Figma REST API 包裝成工具，讓助理讀取檔案、節點、元件、留言與團隊資料。

可以做什麼
  • 讀取 Figma 檔案、節點樹、檔案中繼資料、版本歷程與圖片填色
  • 瀏覽團隊、資料夾、已發佈元件、元件集與樣式
  • 讀取留言與表情回應，並刪除自己留下的留言和回應
  • 檢視變數、函式庫分析、活動日誌與開發者日誌、AI 用量、嵌入與付款資訊
  • 建立或刪除 webhook、開發資源，以及（企業版）團隊與資料夾
適用情境
適合讓助理檢視 Figma 設計稿、設計權杖、元件庫或團隊結構並提出報告，或在聊天用戶端中管理留言、webhook 與開發資源。多數讀取工具適用於任何方案，建立類與分析類工具則需要較高的 Figma 方案。
執行需求
以 stdio 在本機執行，需要 Bun 1.2 以上並以 bunx 啟動（不支援 Node）。需要 Figma 個人存取權杖，透過環境變數 FIGMA_API_KEY 提供，並需要連線至 Figma API 的網路。部分工具需要企業版或組織版方案，以及管理員或方案存取權杖。
安裝前請注意
Figma 個人存取權杖權限範圍較大，應放在用戶端的 env 設定或互動式輸入中，不要寫進共用檔案。多個工具會寫入或刪除資料：刪除留言、回應與 webhook 無法復原，webhook 會呼叫你指定的外部位址。企業版工具可建立團隊與資料夾，並讀取組織日誌與 AI 用量資料。

安裝

在 SourceWeft 中

  1. 開啟 儀表板中的 Figma MCP Server，將其新增到工作區。
  2. 為需要使用其工具的對話啟用該服務。

Desktop only，透過 STDIO。 STDIO 服務會啟動本機處理程序，因此需要 SourceWeft 桌面主機。

其他 MCP 客戶端

參照 儲存庫 中的啟動說明。

README

Figma MCP Server

A local MCP server with full Figma REST API coverage. Works with Claude Desktop, Cursor, VS Code, the Gemini CLI, and any MCP client. Available on npm and the official MCP Registry.

[NPM Downloads]

How it works

Each Figma REST endpoint is exposed as one self-describing MCP tool, auto-discovered at startup from tools/figma/, so adding an endpoint is just adding a file. Required parameters are validated before each call. It runs over stdio.

Prerequisites

Requires Bun ≥ 1.2. It's Bun-native, so launch it with bunx, not npx (Node isn't supported).

Figma API key

Create a personal access token in Figma under Settings > Security > Personal access tokens > Generate new token. Provide it as FIGMA_API_KEY, ideally in your client config's env block (see below).

Configure your client

Every client uses the same server. Point command at bunx, or its absolute path (which bunx) if the client cannot find it on PATH.

json
{  "mcpServers": {    "figma": {      "command": "bunx",      "args": ["figma-mcp-server"],      "env": {        "FIGMA_API_KEY": "your_figma_api_key_here"      }    }  }}

Config file locations:

  • Claude Desktop: Settings > Developer > Edit Config (claude_desktop_config.json)
  • Cursor: ~/.cursor/mcp.json, or .cursor/mcp.json per project
  • Gemini CLI: ~/.gemini/settings.json

Restart the client after editing its config.

VS Code

Use .vscode/mcp.json (workspace) or your user mcp.json, with a servers key. Instead of hardcoding the token, define an input so VS Code prompts for it securely:

json
{  "inputs": [    {      "type": "promptString",      "id": "figma-api-key",      "description": "Figma API Key",      "password": true    }  ],  "servers": {    "figma": {      "command": "bunx",      "args": ["figma-mcp-server"],      "env": {        "FIGMA_API_KEY": "${input:figma-api-key}"      }    }  }}
  • With ${input:figma-api-key}, VS Code prompts you for the key the first time the server starts, then stores it in your OS secret storage.
  • To re-enter or clear it: Command Palette → MCP: List Servers → pick the server → reset/edit its inputs.

Tool coverage

Full coverage of the Figma REST API (non-deprecated endpoints), 55 tools across:

  • Files and nodes (files, node trees, image rendering, image fills, metadata, version history, duplicate)
  • Variables / design tokens (read, published, bulk modify)
  • Components, component sets, and styles (file, published, and team scopes)
  • Comments and reactions
  • Teams (get, create, invite members)
  • Folders (top-level folders, subfolders, files, metadata, create)
  • Users
  • Dev resources
  • Webhooks (v2)
  • Library analytics (component, style, and variable actions and usages)
  • Organization: activity logs, developer logs, AI usage (Enterprise)
  • Embeds and payments

Check your MCP client's tool list for the full, always-current list of tool names and parameters.

Plan requirements

Most tools work with any plan's personal access token. These need higher tiers:

  • Variables (list_file_variables, get_published_variables, modify_variables): Enterprise organization.
  • Library analytics (get_library_*): Organization or Enterprise plan.
  • Activity logs, developer logs, AI usage: Enterprise organization with an admin or plan access token.
  • File duplication, team and folder creation, and team invites (duplicate_file, create_team, create_folder, invite_team_members): Enterprise plan via a private OAuth app.

MIT License · By @planetabhi ⋛⋋( ⊙◊⊙)⋌⋚

來源：README.md，提交 63b9a5b

工具

55

create_dev_resources

Create development resources for a Figma file.

輸入參數url必填name必填node_id必填file_key必填

create_folder

Create a top-level folder in a team. The team must belong to the Enterprise plan associated with the private OAuth app. Enterprise plans only.

輸入參數name必填team_id必填sharing_audience_control必填

create_team

Create a team in the Enterprise plan associated with a private OAuth app. The authenticated user becomes the team owner. Enterprise plans only.

輸入參數name必填descriptionworkspace_idorg_discoverabilitysharing_audience_control必填

create_webhook

Create a webhook that calls the given endpoint when the event triggers. A PING event is sent on creation unless status is PAUSED.

輸入參數statuscontext必填endpoint必填passcode必填context_id必填event_type必填description

delete_comment

Delete a comment from a Figma file. Only the author of the comment can delete it.

輸入參數file_key必填comment_id必填

delete_comment_reaction

Delete a reaction from a comment. Only the author of the reaction can delete it.

輸入參數emoji必填file_key必填comment_id必填

delete_dev_resource

Delete a dev resource from a file.

輸入參數file_key必填dev_resource_id必填

delete_webhook

Delete a webhook by ID. This cannot be reversed.

輸入參數webhook_id必填

duplicate_file

Duplicate a main file or branch into the specified folder as a new standalone file. The copy uses the source's latest saved checkpoint and may omit recent unsaved changes. Enterprise plans only.

輸入參數file_key必填folder_id必填

get_activity_logs

Get activity log events for the organization. Requires an organization admin plan access token (Enterprise).

輸入參數limitordereventsend_timestart_time

get_ai_usage_daily

Get per-user, per-day AI credit usage for the plan. Requires a plan access token with org:ai_metering_usage_read (Enterprise).

輸入參數limitcursorend_date必填start_date必填user_email

get_comment_reactions

Get a paginated list of reactions left on a comment.

輸入參數cursorfile_key必填comment_id必填

get_component_set

Retrieve metadata for a published component set by its key.

輸入參數key必填

get_current_user

Get the current user information from Figma.

無需輸入參數。

get_developer_logs

Get developer log entries for REST API and MCP server requests in the organization. Requires a plan access token with org:developer_log_read (Enterprise). Note: this is a POST request with a JSON filter body.

輸入參數limittokencursordate_rangeip_addresstoken_nametoken_typeuser_emailevent_source

get_figma_file

Retrieve the document tree and metadata of a Figma file as JSON.

輸入參數idsdepthversionfile_key必填geometrybranch_dataplugin_data

get_file_meta

Get metadata for a Figma file (name, folder, last touched, creator, editor type, role, link access, version).

輸入參數file_key必填

get_file_nodes

Retrieve specific nodes (and their subtrees) from a Figma file as JSON.

輸入參數ids必填depthversionfile_key必填geometryplugin_data

get_file_version_history

Retrieve the paginated version history of a Figma file.

輸入參數afterbeforefile_key必填page_size

get_folder_files

Get the files directly within a specified folder.

輸入參數folder_id必填branch_data

get_folder_meta

Get metadata for a folder (name, thumbnail, file count, created/updated timestamps) without enumerating its files.

輸入參數folder_id必填

get_folder_subfolders

Get the direct subfolders within a specified folder.

輸入參數folder_id必填

get_image_fills

Get download URLs for all image fills (user-supplied images) in a Figma file.

輸入參數file_key必填

get_library_component_actions

Get library analytics component action data (detachments, insertions) broken down by the requested dimension.

輸入參數cursorend_datefile_key必填group_by必填start_date

get_library_component_usages

Get library analytics component usage data broken down by the requested dimension.

輸入參數cursorfile_key必填group_by必填

get_library_style_actions

Get library analytics style action data (detachments, insertions) broken down by the requested dimension.

輸入參數cursorend_datefile_key必填group_by必填start_date

get_library_style_usages

Get library analytics style usage data broken down by the requested dimension.

輸入參數cursorfile_key必填group_by必填

get_library_variable_actions

Get library analytics variable action data (detachments, insertions) broken down by the requested dimension.

輸入參數cursorend_datefile_key必填group_by必填start_date

get_library_variable_usages

Get library analytics variable usage data broken down by the requested dimension.

輸入參數cursorfile_key必填group_by必填

get_oembed

Get oEmbed data for a Figma file or published Make site URL, following the oEmbed specification.

輸入參數url必填maxwidthmaxheight

get_payments

Get a user's payment information for a plugin, widget, or Community file you own. Use either plugin_payment_token, or user_id plus exactly one of community_file_id/plugin_id/widget_id.

輸入參數user_idplugin_idwidget_idcommunity_file_idplugin_payment_token

get_published_component_by_key

Retrieve metadata for a published component by its key.

輸入參數key必填

get_published_style

Retrieve metadata for a published style by its key.

輸入參數key必填

get_published_variables

Get the variables and variable collections published from a file. Requires an Enterprise organization / plan access token.

輸入參數file_key必填

get_team

Get metadata for a team the caller can access. Available to private OAuth apps on Professional, Organization, and Enterprise plans, and to plan access tokens on Organization and Enterprise plans.

輸入參數team_id必填

get_team_component_sets

Get a paginated list of published component sets within a team library.

輸入參數afterbeforeteam_id必填page_size

get_team_components

Get a paginated list of published components within a team library.

輸入參數afterbeforeteam_id必填page_size

get_team_folders

Get the top-level folders (previously called projects) within a specified team.

輸入參數team_id必填

get_team_styles

Get a paginated list of published styles within a team library.

輸入參數afterbeforeteam_id必填page_size

get_webhook

Get a webhook by its ID.

輸入參數webhook_id必填

get_webhook_requests

Get webhook requests sent within the last week for a given webhook. Useful for debugging.

輸入參數webhook_id必填

get_webhooks

Get webhooks by context or plan. Provide either context + context_id, or plan_api_id (paginated).

輸入參數cursorcontextcontext_idplan_api_id

invite_team_members

Invite users to a team with the requested role. Each email is processed independently; per-address failures are returned in `errors` with HTTP 200, so always check `errors`. Existing members keep their current role when it is higher. Enterprise plans only.

輸入參數role必填emails必填team_id必填

list_comments

List comments on a Figma file.

輸入參數file_key必填

list_component_sets

List all component sets published in a specific Figma file.

輸入參數file_key必填

list_components

List components in a specific Figma file.

輸入參數file_key必填

list_dev_resources

List development resources for a specific Figma file.

輸入參數file_key必填

list_file_variables

List variables for a specific Figma file.

輸入參數file_key必填

list_styles_in_file

List styles in a specific Figma file.

輸入參數file_key必填

modify_variables

Bulk create, update, and delete variables, variable collections, modes, and mode values in a file. Provide at least one of the arrays; each item needs an "action" of CREATE, UPDATE, or DELETE. Requires an Enterprise organization with Editor seats.

輸入參數file_key必填variablesvariableModesvariableModeValuesvariableCollections

post_comment

Post a comment to a Figma file.

輸入參數message必填file_key必填client_meta

post_comment_reaction

Add a reaction to a comment on a Figma file.

輸入參數emoji必填file_key必填comment_id必填

render_images

Render one or more nodes of a Figma file as images (PNG/JPG/SVG/PDF) and return a map of node IDs to download URLs. URLs expire after 30 days.

輸入參數ids必填scaleformatversionfile_key必填contents_onlysvg_include_idsvg_outline_textsvg_include_node_idsvg_simplify_strokeuse_absolute_bounds

update_dev_resources

Bulk update dev resources across files. Each item must include its id; name and url are optional.

輸入參數dev_resources必填

update_webhook

Update an existing webhook by ID.

輸入參數statusendpoint必填passcode必填event_type必填webhook_id必填description

版本歷史

2
  1. v3.1.3最新Nov 1, 2026
  2. v3.1.1Sep 16, 2026

評分

已滿足適用檢查項的 80%

該評分衡量此收錄條目的完整程度，依據註冊中心條目、端點與公開來源計算得出。它不是對伺服器本身的評價，也不表示伺服器安全或目前可用：可連通性是帶日期的檢查結果，評分也不包含安裝量或使用者評價。

  • 近 30 天內可連通25 分
  • 已宣告認證方式10 分

    請在註冊中心條目中宣告憑證請求標頭，或保持端點能夠回應探測，以便判定其認證方式。

  • 已列出工具必需15 分
  • 描述必需15 分
  • 圖示10 分
  • 文件15 分
  • 授權條款10 分

    請在儲存庫或註冊中心條目中宣告授權條款。

其他 Figma 整合

Figma MCP Server

com.figma.mcp官方發布者

Figma 官方遠端 MCP 伺服器，為 AI 程式助理提供 Figma 設計脈絡，用來產生與更新程式碼。

Streamable HTTP可網頁執行驗證方式
開發者工具需要憑證Oct 24, 2026

Figma Vector MCP

由 GitHub 帳號 workingmodel 發布

本機 MCP 伺服器加 Figma 外掛，讓助理在 Figma 畫布上建立與編輯可完整編輯的向量節點、形狀、文字與元件。

STDIO僅桌面
開發者工具58 個工具Oct 30, 2026

Figma CodeKit MCP

由 GitHub 帳號 Mehmoodqureshi 發布

把 Figma 畫框轉換成 HTML、React 或 Next.js 程式碼，並將渲染結果與設計稿做像素比對，反覆迭代直到收斂。

STDIO僅桌面
開發者工具3 個工具Nov 7, 2026

figma-mcp

由 GitHub 帳號 Mehmoodqureshi 發布

把 Figma 畫框確定性地轉成 HTML、React 或 Next.js 程式碼，在 Chromium 中算繪並與設計稿做像素比對，直到一致。

STDIO僅桌面
開發者工具尚未驗證Oct 24, 2026

figma-vault

由 GitHub 帳號 NBhey 發布

本機 MCP 伺服器，讓助理讀取一次性拉取到本機儲存庫的 Figma 設計，可離線使用，不需 Figma 權杖，也不受速率限制。

STDIO僅桌面
知識與記憶尚未驗證Oct 25, 2026