Claude Code to Figma ·Antigravity → Figma ·カーソル → Figma ·任意のMCP IDEからFigmaへ

✅ テスト済み:Claude Code、Antigravity  |  🔧 対応:カーソル、VS Code、Windsurf、Zed(任意のMCP標準クライアント)

双方向Figma MCPブリッジ — AIアシスタント(Claude Code、Cursor、Windsurf、Antigravity、VS Code Copilot、または任意のMCP互換IDE)がFigmaキャンバス上で直接UIを描画し、既存設計を構造化データ、スクリーンショット、コード対応トークンとして読み返すことができる。Figma APIキーは不要で、完全にlocalhost上で動作します。

Figma Desktopが必要です — プラグインはlocalhostのHTTPポーリングを通じてMCPサーバーと通信します。Figmaのウェブアプリはlocalhostネットワークへのアクセスを許可していないため、Figma Desktopが必要です。

ローカルホストブリッジの仕組み

MCPサーバーはlocalhost:38451にバインドされた小さなHTTPサーバーを開始します。Figmaプラグイン(Figma Desktop内で動作)は長いポーリングを用い、サーバーは作業が到着するまで最大8秒までリクエストを保持し、新しいオペレーションがキューに入れられると即座にフラッシュします(ほぼリアルタイムのレイテンシ) Claude Code (CLI)

Claude Desktop

設定ファイルを編集:

• macOS: ~/Library/Application Support/Claude/claude_desktop_config.json

figma-ui-mcp

Claude Code to Figma · Antigravity to Figma · Cursor to Figma · Any MCP IDE to Figma

✅ Tested: Claude Code, Antigravity  |  🔧 Compatible: Cursor, VS Code, Windsurf, Zed (any MCP stdio client)

Bidirectional Figma MCP bridge — let AI assistants (Claude Code, Cursor, Windsurf, Antigravity, VS Code Copilot, or any MCP-compatible IDE) draw UI directly on Figma canvas and read existing designs back as structured data, screenshots, or code-ready tokens. No Figma API key needed — works entirely over localhost.

Requires Figma Desktop — the plugin communicates with the MCP server over localhost HTTP polling. Figma’s web app does not allow localhost network access, so Figma Desktop is required.

Claude ──figma_write──▶ MCP Server ──HTTP (localhost:38451)──▶ Figma Plugin ──▶ Figma Document
Claude ◀─figma_read──── MCP Server ◀──HTTP (localhost:38451)── Figma Plugin ◀── Figma Document

How the localhost bridge works

The MCP server starts a small HTTP server bound to localhost:38451. The Figma plugin (running inside Figma Desktop) uses long polling — the server holds requests up to 8s until work arrives, flushing immediately when new ops are queued (near-realtime latency <100ms). All traffic stays on your machine — nothing is sent to any external server.

Multi-instance support (v2.3.0+): Multiple Figma files/tabs can connect simultaneously. Each plugin instance sends a sessionId, and the bridge routes operations to the correct session. Use the optional sessionId param in figma_write/figma_read to target a specific file.

---

Features