gethopp/figma-mcp-bridge

解決する課題

Figma MCP Bridge を使用すると、AIエージェントは無料のFigmaアカウントに課せられる厳しいAPIレート制限に抵触することなく、Figmaドキュメントとやり取りできます。ローカルプラグインをブリッジとして使用し、標準のクラウドAPIをバイパスすることで、AIツールがFigmaファイル内で直接設計データを読み取り、編集を実行できるようにします。

仕組み

このシステムは、FigmaプラグインとMCPサーバーの2つの部分で構成されています。プラグインはFigmaデスクトップアプリ内で実行され、ライブドキュメントデータをWebSockets経由でローカルのMCPサーバーにストリーミングします。サーバーは、AIクライアント（CursorやClaude Desktopなど）からのツール呼び出しを fileKey を使用して適切なFigmaファイルにルーティングします。リーダー・フォロワーアーキテクチャをサポートしており、複数のAIツールが同時に同じブリッジに接続できます。

対象ユーザー

AI搭載のIDEやエージェントを使用して、設計仕様の読み取り、アセットのエクスポート、またはFigma内でのUI要素の自動作成を行うデザイナーや開発者。

主な特徴

• API制限の回避: ローカルプラグインを使用することで、無料のFigmaアカウントの月間6リクエスト制限を回避します。
• マルチファイルサポート: 複数のFigmaファイルを同時に接続し、エージェントが fileKey を介してそれらのいずれにもクエリを実行できるようにします。
• 読み書き機能: ドキュメントツリー、スタイル、プロトタイプを読み取るツールに加え、フレーム、シェイプ、テキストの作成やオートレイアウトの適用を行うツールが含まれています。
• 幅広い互換性: Figmaデザインファイル、Dev Mode、FigJamボード全体で動作します。
• アセットエクスポート: ノードをPNG、SVG、JPG、またはPDFとしてエクスポートし、ローカルファイルシステムに直接保存できます。