Figma MCP Server專案

MCP工具

Figma MCP Server專案

figma-mcp-server 是一個專為全球領先的協作設計工具 Figma 所打造的模型內容協定 (Model Context Protocol, MCP) 伺服器。其核心目標是作為 AI 助理（如 Claude Desktop）與設計師的 Figma 工作區之間的橋樑，讓 AI 能夠以程式化的方式讀取和理解設計檔案的內容。

這個專案的價值在於，它將一個通用的 AI 助理，轉變為一個能夠深入設計系統的智慧設計助理。開發者和設計師可以透過自然語言，直接查詢 Figma 檔案的詳細資訊，為實現「設計即程式碼 (Design as Code)」以及自動化設計流程提供了強大的基礎。

核心價值：讓你的 AI 助理讀懂你的設計系統

透過 figma-mcp-server，你可以讓 AI 助理直接存取你的 Figma 檔案，執行以下查詢：

• 「幫我列出 [專案 ID] 這個專案裡所有的檔案。」
• 「取得 [檔案金鑰] 這個檔案的詳細資訊。」
• (未來潛力) 「幫我在這個檔案裡建立一個名為 primary-color 的色彩變數。」
• (未來潛力) 「用現有的設計變數，幫我建立一個 Dark Theme (深色主題)。」

主要功能與特色

此專案的一個關鍵特點是其前瞻性的架構設計。它明確區分了目前可實現的功能與未來潛在的功能：

1. 目前已實現的功能 (唯讀操作):

   • get-file: 取得特定 Figma 檔案的詳細資訊。
   • list-files: 列出特定 Figma 專案中的所有檔案。
   • 安全認證: 透過 Figma 的個人存取權杖 (Personal Access Token) 進行安全連線。
   • 效能優化: 內建了 LRU 快取機制、API 速率限制處理等，確保高效穩定的運作。

2. 架構已支援但受限於 API 的未來功能 (寫入操作):

   • 專案的程式碼架構已經預先設計好了用於管理設計變數 (Design Tokens) 和主題 (Themes) 的工具，例如 create-variables 和 create-theme。
   • 然而，由於目前 Figma 的 REST API 限制，使用個人存取權杖只能進行唯讀操作，無法直接修改設計檔案。
   • 這意味著，一旦 Figma 開放更強大的 API 權限或透過插件 (Plugin) 形式，此伺服器可以立即啟用這些強大的寫入和管理功能，無需重寫架構。

安裝與設定

此專案需要使用者進行安全的認證設定：

1. 需要 Figma 存取權杖:

   • 使用者必須在自己的 Figma 帳戶中建立一個個人存取權杖。
   • 這個權杖需要被安全地儲存在專案根目錄下的 .env 設定檔中。

2. 本地建置與整合:

   • 使用者需要將專案複製到本地，安裝依賴套件後執行 npm run build。
   • 在 Claude Desktop 的設定檔中，需要提供建置後產生的 index.js 檔案的絕對路徑，並傳入 Figma 存取權杖。

總結來說，figma-mcp-server 是一個極具潛力的開發者與設計師工具。在現階段，它已經能讓 AI 助理有效地讀取和分析 Figma 設計資產。更重要的是，它以一個極具擴展性的架構，為未來實現更深度的「AI 輔助設計自動化」鋪平了道路，展現了將大型語言模型與現代設計工作流深度整合的巨大潛力。

• MCP平台來源: github
• 連結: https://github.com/TimHolden/figma-mcp-server

立即試用MCP工具