awdr74100/figwright

解決的問題

Figwright 為 AI 編碼代理（如 Claude Code 或 Cursor）與 Figma 之間提供雙向橋樑。它不僅允許代理讀取設計資料以產生程式碼，還能直接主動編輯與創作 Figma 畫布，無需付費的 Figma Dev Mode 席位。

工作原理

此專案由一個 MCP（模型上下文協定）伺服器與配套的 Figma 插件組成。MCP 客戶端（AI 代理）透過 stdio 與伺服器通訊，伺服器再透過本地 WebSocket 將指令轉送至 Figma 插件。此架構確保所有資料皆保留在本地機器上。為提升程式碼產生的準確性，採用「提供者優先」方法，優先呈現設計上下文，並將 Figma 資料映射至使用者現有程式碼庫的元件與標記，而非使用通用標記。

適用對象

在 Figma 中使用 AI 代理實作設計或建立原型的開發者與設計師，特別是尋找官方 Dev Mode MCP 工具免費替代方案的人群。

主要亮點

• 雙向功能：提供 112 個工具，支援讀取（檢查佈局、樣式與變數）與寫入（建立框架、文字與自動佈局）畫布。
• 提供者優先的程式碼產生：偵測使用者的特定框架與樣式系統，重用現有元件與圖示。
• 本地優先的安全性：所有通訊皆透過本地迴路進行，確保設計從不傳送至外部伺服器。
• 可擴展的技能：附帶可安裝的「技能」（如 figma-codegen 和 figma-build），用於協調特定工作流程的工具。
• 免費版相容：無需付費 Dev Mode 席位，可在免費 Figma 版本上運行。