mcpField
F
Figma

Figma

リモート
pipeworx.ioメディア・デザイン03 日前に更新
リポジトリ公式サイト

Figma について

Figma MCP サーバーは、接続済みの Figma デザインやフィードバックを調べます。ファイルやノードの概要、画像プレビューを提供し、ローカルの stdio と Pipeworx ゲートウェイに対応します。

主な機能

  1. 01接続中の Figma ユーザー確認
  2. 02ファイル構成とメタデータの概要
  3. 03ファイルコメントとフィードバックの一覧
  4. 04指定ノードの確認
  5. 05指定ノードの画像レンダリング

活用シーン

  1. 01接続中の Figma アカウントの確認
  2. 02デザインファイルのページとメタデータの確認
  3. 03デザインファイル内の議論の確認
  4. 04指定したフレーム、コンポーネント、レイヤーのプレビュー

MCP 対応

MCP クライアントに Figma のアカウント、ファイル、コメント、ノード、画像用ツールを公開します。stdio でローカル実行するか、共有ゲートウェイツールも含む Pipeworx ゲートウェイ経由で接続できます。

設定

リモートサーバーはインストール不要です。クライアントを選んで設定をコピーするか、ワンクリックで導入できます。

エンドポイントhttps://gateway.pipeworx.io/figma/mcp
インストールコマンドをコピー
Claude CodeTerminal
Cursor.cursor/mcp.json
VS Code.vscode/mcp.json
Claude Desktopclaude_desktop_config.json
Windsurf~/.codeium/windsurf/mcp_config.json

コマンドはターミナルで実行し、JSON は各クライアントの MCP 設定に貼り付けて再起動します。認可が必要なサーバーは初回接続時にログインを求めます。

ツール

詳細

mcp-figma

Figma MCP パック

Pipeworx の一部です。AI エージェントを1879以上のライブデータソースに接続する MCP ゲートウェイです。これは独立した非公式の連携機能であり、上流プロバイダーとは提携しておらず、承認も公開もされていません。

ツール

ツール説明
get_meサインイン中の Figma ユーザーの ID、メールアドレス、ハンドル名、アバター画像の URL を取得します。どのユーザーの Figma アカウントが接続されているかを確認する際に使用します。
get_fileファイルキーを指定して、Figma デザインファイルの簡潔な概要を取得します。名前、最終更新日時、バージョン、エディターの種類、ロール、サムネイル URL、最上位ページの一覧(ID、名前、種類、子要素数)が含まれます。ノードツリー全体を取得せずに、Figma デザインファイルの構造を把握する際に使用します。
list_commentsFigma デザインファイルのコメント一覧を取得します。各コメントの ID、メッセージ、作成者のハンドル名、作成日時、解決日時が返されます。デザインに関するフィードバックや議論を確認する際に使用します。
get_file_nodesノード ID を指定して、Figma デザインファイル内の特定のノードを取得します。ノード ID と { name, type } の簡潔なマップが返されます。デザインファイル内の特定のフレーム、コンポーネント、レイヤーを調べる際に使用します。
get_file_imagesFigma デザインファイル内の特定のノードの画像をレンダリングします。ノード ID とレンダリング済み画像 URL のマップが返されます。デザイン内のフレーム、コンポーネント、レイヤーのビジュアルプレビュー(PNG、SVG、JPG)を取得する際に使用します。

クイックスタート

MCP クライアント(Claude Desktop、Cursor、Windsurf など)に追加します。

{
  "mcpServers": {
    "figma": {
      "url": "https://gateway.pipeworx.io/figma/mcp"
    }
  }
}
このエンドポイントが実際に提供するもの

https://gateway.pipeworx.io/figma/mcp の tools/list は、上記の表にあるツールに加えて、Pipeworx 共通のメタツールである ask_pipeworx、discover_tools、search_within、remember/recall など、ゲートウェイ全体で使えるツールも返します。そのため、表示されるツール数はこの表より多くなります。現在、単一パックのエンドポイントには、このパック固有のツールと合わせて約30個の共通ツールが一覧表示されます。接続時の initialize 応答に正確な対象範囲が示されており、その日の状況を確認する際の正式な情報源となります。

これは意図的な仕様であり、偶然に多重化されているわけではありません。メタツールを使うことで、ask_pipeworx を介してカタログ全体から適切なツールを呼び出し、このパックが対応していない質問にも、MCP サーバーを追加せずに回答できます。現在、メタツールなしでパックのエンドポイントを接続する方法はありません。追加のスキーマがルーティングによる利点以上にコンテキストを消費する場合は、複数のパックエンドポイントではなく、フルゲートウェイに一度だけ接続してください。

また、パックごとのツールだけでなく、すべてのパックのツールを直接一覧表示するには、Pipeworx のフルゲートウェイに接続してください。

{
  "mcpServers": {
    "pipeworx": {
      "url": "https://gateway.pipeworx.io/mcp"
    }
  }
}

どちらの URL も、同じゲートウェイと同じ1879以上のデータソースに接続します。唯一の違いは、どのパックのツールが直接一覧表示されるかです。どちらからでも ask_pipeworx を使ってすべてのツールを呼び出せます。

MCP クライアントがない場合:HTTP 経由で呼び出す

このパックは、接続済みの Figma アカウントを使うため、Pipeworx キーが必要です。https://pipeworx.io/account でサインインして Figma に接続し、Authorization: Bearer <your Pipeworx key> を指定して POST https://gateway.pipeworx.io/v1/tools/figma_get_me を呼び出してください。ツールを確認するには GET https://gateway.pipeworx.io/v1/tools/figma_get_me を使います。ツールを検索するには {"query":"..."} を指定して POST https://gateway.pipeworx.io/v1/tools/search_packs を呼び出してください。

スタンドアロン(ゲートウェイアカウント不要)

このパッケージはローカルの stdio MCP サーバーとしても実行できます。Pipeworx アカウントも、ゲートウェイとの往復通信も必要ありません。

{
  "mcpServers": {
    "figma": {
      "command": "npx",
      "args": ["-y", "@pipeworx/mcp-figma"]
    }
  }
}

または、起動することを確認するために、直接実行してください。

npx -y @pipeworx/mcp-figma

stdin/stdout 経由で MCP を使用し、initialize/tools/list/tools/call に応答します。対象となるのはこのパックのツールのみで、上記のゲートウェイ接続で追加される共通メタツールは含まれません。同じソース、同じツールを使用し、ask_pipeworx によるルーティングはありません。

ask_pipeworx を使う

ツールを直接呼び出す代わりに、自然な英語で質問できます。これは上記のパックエンドポイントでも、フルゲートウェイでも使用できます。

ask_pipeworx({ question: "your question about Figma data" })

ゲートウェイが適切なツールを選び、引数を自動的に設定します。

More

License

MIT

コメント

MCP は初めてですか?

プロトコルの概要から最初のサーバーの導入まで、よくある疑問にまとめて答えます。

AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。