Figma Context MCP
デザイン
GLips/Figma-Context-MCP15,544 スター
Graham Lipsman
cursorclaudewindsurfgeneric
FreeOpen SourceAPI
このサーバーについて
Figmaのレイアウトデータをコーディングエージェントに提供するMCPサーバー。Cursorなどのツールがデザインをワンショットで実装でき、スクリーンショット貼り付けより遥かに高精度。
インストール
npx -y figma-developer-mcp --figma-api-key=<key> --stdioよくある質問
Figma Context MCP はデザイン再現度をどう高めますか？
スクリーンショットではなく、Figma API から取得したレイアウト・色・タイポグラフィのメタデータを簡約化してモデルに渡します。画像からの推測ではなく正確な数値を得られるため、デザインの一発再現精度が大幅に向上します。
Cursor で Figma Context MCP を設定するには？
Figma のアカウント設定でパーソナルアクセストークンを生成し、Cursor の MCP 設定に npx -y figma-developer-mcp --figma-api-key=<key> --stdio を追加します。使うときは Figma のファイルや選択範囲のリンクを AI に貼るだけです。
Figma Context MCP の利用に Figma 有料プランは必要ですか？
不要です。サーバーは無料のオープンソース（MIT）で、Figma の無料アカウントでも API トークンを生成して自分のファイルを読み取れます。対象ファイルの閲覧権限があれば AI はそのデザインデータを取得できます。