Cursor Talk to Figma MCP Server
Cursor Talk to Figma MCPサーバーでClaude連携・Figmaデザイン読み取りと編集を自動化
bunx cursor-talk-to-figma-mcp@latest概要
Cursor Talk to Figma MCP Serverの設定方法と使い方。
「Figma」上のデザインをClaudeなどのAIエージェントから読み取り・プログラマティックに編集できるMCPサーバー。
Figma上のレイヤー構造・テキスト・コンポーネント・アノテーションの取得や、選択中ノードの書き換えが可能。
ClaudeとFigmaのMCPサーバー連携により、デザインから実装コードへの変換やデザイン修正の自動化ができる。
MCPサーバーと、対になるFigmaプラグインがWebSocket経由で通信する2層構成。
設定方法はbunxでMCPサーバーを起動しFigmaプラグインを有効化するだけでシンプルに完結する。
料金・APIキー情報
料金
完全無料APIキー
🔓 不要✅このMCPはAPIキー不要です。別途セットアップが必要な場合があります（上記参照）。
こんな使い方ができます
Figma上の選択中フレームをClaudeに読み込ませてコンポーネント実装コードへ変換できる
テキストレイヤーの一括書き換えや翻訳をClaude経由でFigmaに反映できる
デザインシステムのレイヤー構造をClaudeに解析させてドキュメント化できる
アノテーションを参照しながら設計指示を理解した上での修正をClaudeに任せられる
セットアップ手順
- 1
Bun（https://bun.sh）をインストールする
- 2
Figmaコミュニティから対になるFigmaプラグインをインストールしFigmaで有効化する
- 3
Claude Codeに追加：claude mcp add TalkToFigma -- bunx cursor-talk-to-figma-mcp@latest
設定ファイル
コピー前に確認
Bunランタイムが必要。Figmaアカウントと、対になるFigmaコミュニティプラグインのインストールが必須。APIキー不要だが、MCPサーバーとFigmaプラグインがWebSocketで接続できる必要がある。
claude mcp add TalkToFigma -- bunx cursor-talk-to-figma-mcp@latest注意事項
リポジトリ grab/cursor-talk-to-figma-mcp が本体。既存の figma-mcp-server.mdx（GLips/Figma-Context-MCP）はFigma APIを直接叩く方向性なのに対し、本サーバーはFigmaプラグインと連携してリアルタイムに編集まで行える点が特徴。Cursor向けに開発されたがClaude Desktop等の他MCPクライアントでも利用可能。