figma-mcp-rs

figma-mcp-rs

Rust 製の Figma／FigJam MCP サーバー — 無料で、レート制限はありません。vkhanhqui/figma-mcp-go を Rust に移植し、SolidJS プラグインを書き直して FigJam に対応しました。

プラグイン経由で Figma と FigJam の読み取り／書き込みに完全対応したオープンソースの MCP サーバーです — REST API は不要で、レート制限もありません。テキストをデザインに、デザインを実際のコードに変換できます。Claude、Cursor、GitHub Copilot、および MCP 互換のあらゆる AI ツールで動作します。

主な特長

• Figma API トークンは不要です
• レート制限なし — 無料プランでも安心です
• プラグインブリッジ経由で Figma／FigJam のライブデータを読み取り・書き込み — 全 87 ツール（Go 版の 73 ツールに、get_status、execute_code、FigJam 用 8 ツール、エスケープハッチの use_figma、および 4 つのデザインシステム用ツール update_style、update_variable、set_variable_mode、bind_variable_to_style を追加）
• スタイル、変数（値、エイリアス、スコープ、モード）、コンポーネント、プロトタイプ、コンテンツの完全なデザイン自動化
• 色はどこでも hex、rgb()、hsl()、oklch() で指定でき、get_styles と export_tokens は colorFormat で任意の形式を出力できます
• デザイン戦略を内蔵 — MCP プロンプト 12 種を搭載
• ネイティブバイナリで、起動が速く、メモリ使用量も少なめです
• プラグインをバイナリに同梱 — サーバーが初回実行時に自動インストールするため、ダウンロードは不要です
• rmcp 3.2 を基盤とし、クライアントごとに MCP プロトコルのリビジョンをネゴシエートします

これが作られた理由

公式の Figma MCP サーバーは REST API を使用しますが、プランごとにレート制限があります。

Figma プラン	REST の利用上限
Starter	6 回／月
Professional	200 回／日
Enterprise	600 回／日

このサーバーは REST API を一切呼び出しません。Figma Desktop 内で動作するプラグインとローカル WebSocket 経由で通信するため、読み取りも書き込みも無制限かつ無料です。また REST API とは異なり、プラグインから開いているファイルに書き込みできます。

パフォーマンス

Apple M4 Pro で測定：アイドル時の RSS は約 6 MB、ツールの往復処理中にプラグインを接続した状態で約 7 MB、起動時間は 10 ms 未満です。Go 版の RSS は約 15～25 MB です。

インストールとセットアップ

1. AI ツールを設定する

Claude Code CLI

claude mcp add -s project figma-mcp-rs -- npx -y figma-mcp-rs@latest

または、ソースからビルドします。

make build   # cargo build --release + plugin build
claude mcp add -s project figma-mcp-rs -- /path/to/figma-mcp-rs/target/release/figma-mcp-rs

Codex CLI

codex mcp add figma-mcp-rs -- npx -y figma-mcp-rs@latest

Claude Code プラグインマーケットプレイス（スキル 15 種もインストールされます）

/plugin marketplace add <this-repo>
/plugin install figma-mcp-rs@figma-mcp-rs

.mcp.json（Claude およびその他の MCP 互換ツール）

{
  "mcpServers": {
    "figma-mcp-rs": {
      "command": "npx",
      "args": ["-y", "figma-mcp-rs"]
    }
  }
}

.vscode/mcp.json（Cursor／VS Code／GitHub Copilot）

{
  "servers": {
    "figma-mcp-rs": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "figma-mcp-rs"]
    }
  }
}

Docker

docker build -t figma-mcp-rs .
docker run -i --rm -p 1998:1998 figma-mcp-rs

Docker 用の .mcp.json：

{
  "mcpServers": {
    "figma-mcp-rs": {
      "command": "docker",
      "args": ["run", "-i", "--rm", "-p", "1998:1998", "figma-mcp-rs"]
    }
  }
}

イメージは 0.0.0.0:1998（デフォルトの CMD に設定済み）で待ち受けるため、Figma プラグインはポートマッピングを通じて通常どおり ws://127.0.0.1:1998 に接続します。ホスト側のポートは 1998 のままにするか、プラグイン UI でホストを更新してください。プラグイン接続ごとにコンテナを 1 つ実行してください。同一マシンで複数の MCP クライアントを同時に使用する場合は、リーダー選出によって 1 つのプラグイン接続を共有するネイティブバイナリを推奨します。コンテナ内で自動インストールされるプラグインのパスにはホストからアクセスできません。代わりに、このリポジトリの plugin/ ディレクトリまたはリリースの plugin.zip からプラグインをインポートしてください。

サーバーフラグ：--ip（デフォルト 127.0.0.1）、--port（デフォルト 1998）。

2. Figma プラグインをインストールする

プラグインはサーバーバイナリに同梱されているため、ダウンロードやビルドは不要です。

1. サーバーを一度起動します（上記のいずれの方法でもかまいません）。起動時に manifest.json、dist/code.js、dist/index.html が ~/.figma-mcp-rs/plugin/（Windows：%USERPROFILE%\.figma-mcp-rs\plugin\）に書き出され、パスがログに記録されます。
2. Figma Desktop で、プラグイン → 開発 → マニフェストからプラグインをインポートを選択し、~/.figma-mcp-rs/plugin/manifest.json を指定します。
3. 任意の Figma または FigJam ファイル内でプラグインを実行します。プラグインは ws://127.0.0.1:1998 経由でサーバーに接続します（ホスト／ポートはプラグインの UI で設定できます）。

ツールが plugin not connected というエラーで失敗した場合は、get_status を呼び出してください。ブリッジを診断し、セットアップ手順を返します。

複数のサーバーインスタンスを安全に実行できます。最初にポートをバインドしたインスタンスがリーダーとなり、プラグイン接続を所有します。それ以外はフォロワーとなり、ツール呼び出しをプロキシします。リーダーが停止した場合は、自動的に引き継ぎます。

FigJam と Slides のサポート

プラグインはすべてのエディターで読み込まれます（editorType: ["figma", "figjam", "slides", "dev"]）。

• 読み取りは両方で動作します。get_document／get_design_context は FigJam のノードタイプ（STICKER、CONNECTOR、MARKER、WIDGET、EMBED、MEDIA…）をシリアル化します。
• FigJam の書き込みには、名前付きツールが 8 つあります。create_sticky、create_stickies、create_connector、create_shape_with_text、create_table、create_code_block、auto_arrange、get_board_contents
• Figma 専用ツール（スタイル、変数、コンポーネント、プロトタイプのリアクション、自動レイアウト）は、FigJam ファイルでは明確なエラーを返します。
• 未対応の機能 — Slides、チームライブラリの変数／スタイル（figma.teamLibrary.*、importVariableByKeyAsync）、その他ラップされていない機能には、use_figma を使用してください。

利用可能なツール

ステータス

ツール	説明
get_status	プラグインブリッジが接続されているか確認します。未接続の場合はセットアップ手順を返します。ツールが plugin not connected で失敗した場合は、まずこれを呼び出してください。

エスケープハッチ

ツール	説明
use_figma	ファイル内で Plugin API の JavaScript を実行します。コードは async () => { … } の本体です。トップレベルの await が使用でき、返されるのは return の値のみです（console.log は破棄されます。値は JSON にシリアル化できる必要があるため、ノードオブジェクトではなく ID／件数／名前を返してください）。名前付きツールでラップされていない機能（Slides、コンポーネントのバリアントとプロパティ、ベクターネットワーク、スタイル付きテキスト範囲、変数のスコープ、1 回のラウンドトリップでの一括編集など）に対応します。
execute_code	同じサンドボックス内で任意の Plugin API コードを実行します。コードは非同期関数の本体として実行され、長時間かかる処理向けにオプションの timeoutMs（1～25000 ミリ秒、デフォルトは 5000）を指定できます。ユーザーが開いているファイルで実行され、Cmd/Ctrl+Z で元に戻せます。専用ツールで対応できない操作にのみ使用し、専用ツールがある場合はそちらを優先してください。

書き込み — 作成

ツール	説明
create_frame	自動レイアウト、塗りつぶし、親をオプションで指定してフレームを作成します
create_rectangle	塗りつぶしと角の半径をオプションで指定して長方形を作成します
create_ellipse	楕円または円を作成します
create_text	テキストノードを作成します（フォントは自動的に読み込まれます）
import_image	base64 画像をデコードし、長方形の塗りつぶしとして配置します
create_component	既存の FRAME ノードを再利用可能なコンポーネントに変換します
create_section	ページ上のフレームを整理するための Figma Section ノードを作成します

書き込み — 変更

ツール	説明
set_text	既存のTEXTノードまたはSTICKERノードのテキストコンテンツを更新します
set_fills	ノードの塗りつぶし色（16進数）を単色に設定します
set_strokes	ノードの線の色と太さを単色で設定します
set_opacity	1つ以上のノードの不透明度を設定します（0 = 透明、1 = 不透明）
set_corner_radius	角丸の半径を設定します — 全角共通または角ごと
set_auto_layout	1つ以上のノードの自動レイアウトプロパティを設定します — 方向、パディング、間隔、配置、折り返し、HUG/FILLのサイズ設定、絶対位置指定（Figmaのみ）
set_visible	1つ以上のノードを表示または非表示にします
lock_nodes / unlock_nodes	1つ以上のノードをロック／ロック解除します
rotate_nodes	1つ以上のノードの絶対回転角度を度数で設定します
reorder_nodes	z順序を変更します：bringToFront、sendToBack、bringForward、sendBackward
set_blend_mode	ブレンドモードを設定します（MULTIPLY、SCREEN、OVERLAY、…）
set_constraints	1つ以上のノードにレスポンシブ制約を設定します
move_nodes	ノードを絶対座標のx/y位置に移動します
resize_nodes	ノードの幅や高さを変更します
rename_node	ノードの名前を変更します
clone_node	ノードを複製します。必要に応じて位置変更や親の変更もできます
reparent_nodes	ノードを別の親フレーム、グループ、またはセクションに移動します
group_nodes / ungroup_nodes	ノードをGROUPにグループ化／グループを解除します
batch_rename_nodes	検索／置換、正規表現、またはプレフィックス／サフィックスで一括リネームします
find_replace_text	サブツリーまたはページ内のTEXTノード全体からテキストを検索して置換します。正規表現に対応しています
delete_nodes	1つ以上のノードを完全に削除します

書き込み — プロトタイプ（Figmaのみ）

ツール	説明
set_reactions	プロトタイプのリアクション（トリガー＋アクション）を設定します。モードは replace または append です
remove_reactions	すべてのリアクション、またはインデックスで指定したリアクションを削除します

書き込み — スタイル（Figmaのみ）

ツール	説明
set_effects	ドロップシャドウ／ぼかし効果をノードに直接適用します
create_paint_style / create_text_style / create_effect_style / create_grid_style	名前付きのローカルスタイルを作成します
update_style	スタイルをその場で更新します — 塗りの色、テキストのフォント／サイズ／間隔、効果、グリッドに加え、名前と説明も更新できます
bind_variable_to_style	変数をスタイルにバインドし、スタイル自体をトークン駆動にします
apply_style_to_node	既存のローカルスタイルをノードに適用します
delete_style	IDでスタイルを削除します

書き込み — 変数（Figmaのみ）

ツール	説明
create_variable_collection	任意で初期モードを指定して、新しいローカル変数コレクションを作成します
add_variable_mode	既存のコレクションに新しいモード（例：Light/Dark）を追加します
create_variable	コレクション内に変数（COLOR/FLOAT/STRING/BOOLEAN）を作成します
set_variable_value	モードに対する変数の値を設定します — リテラル値、または別の変数へのエイリアスを指定できます
update_variable	変数またはコレクションの名前を変更します。説明、スコープ、Dev Modeのコード構文を設定したり、モードの名前を変更したりできます
set_variable_mode	ノードまたは現在のページで、コレクションのモードオーバーライドを適用または解除します
bind_variable_to_node	変数をノードのプロパティ（塗り、線、サイズ、間隔、…）にバインドします。バインドを解除するには variableId を省略します
delete_variable	変数、コレクション全体、または単一のモードを削除します

書き込み — ページ

ツール	説明
add_page	新しいページを追加します（名前とインデックスは任意）
delete_page	IDまたは名前でページを削除します
rename_page	IDまたは現在の名前でページの名前を変更します

書き込み — コンポーネントとナビゲーション

ツール	説明
navigate_to_page	IDまたは名前でアクティブなページを切り替えます
swap_component	INSTANCEノードのメインコンポーネントを入れ替えます
detach_instance	コンポーネントインスタンスを通常のフレームに切り離します

読み取り — ドキュメントと選択範囲

ツール	説明
get_document	現在のページツリー全体
get_metadata	ファイル名、ページ数、現在のページ
get_pages	すべてのページ（ID＋名前）— 軽量
get_selection	現在選択されているノード
get_node / get_nodes_info	IDで指定した単一ノード／複数ノード
get_design_context	detail レベル（minimal/compact/full）で深さを制限したツリー
search_nodes	名前の部分一致やタイプでノードを検索
scan_text_nodes	サブツリー内のすべてのテキストノード
scan_nodes_by_types	タイプのリストに一致するノード
get_viewport	現在のビューポートの中心、ズーム、表示範囲
get_reactions	ノード上のプロトタイプのリアクション
get_fonts	現在のページで使用されているフォント（使用頻度順）

読み取り — スタイルと変数

ツール	説明
get_styles	ペイント、テキスト、エフェクト、グリッドのスタイル — 説明、公開状態、バインドされた変数、colorFormat を含む
get_variable_defs	変数コレクション、モード、値、エイリアス、スコープ、コード構文
get_local_components	すべてのコンポーネントとコンポーネントセット
get_annotations	開発モードの注釈
export_tokens	デザイントークン（変数＋ペイントスタイル）をJSONまたはCSSとしてエクスポート。エイリアスの var() 参照と colorFormat を含む

エクスポート

ツール	説明
get_screenshot	任意のノードをBase64画像としてエクスポート
save_screenshots	画像をディスクにエクスポート（サーバー側で書き込み）
export_frames_to_pdf	複数のフレームを1つの複数ページPDFとしてエクスポート（サーバー側で結合）

FigJam

ツール	説明
create_sticky	テキスト付きの付箋を作成（FigJamのみ）
create_stickies	複数の付箋を一度に作成（オプションでグリッドに自動配置、FigJamのみ）
create_connector	コネクターを作成（オプションで2つのノード間に接続、FigJamのみ）
create_shape_with_text	テキスト付きの図形を作成 — 長方形、円、ひし形など（FigJamのみ）
create_table	セルのテキストを任意で指定して表を作成（FigJamのみ）
create_code_block	シンタックスハイライト付きのコードブロックを作成（FigJamのみ）
auto_arrange	オブジェクトをグリッド、行、または列のレイアウトに自動配置（FigJamのみ）
get_board_contents	現在のFigJamページ上のすべてのオブジェクトとコネクター（テキスト内容と接続データを含む）

MCP プロンプト（12）

read_design_strategy、design_strategy、text_replacement_strategy、annotation_conversion_strategy、swap_overrides_instances、reaction_to_connector_strategy、style_audit_strategy、bulk_rename_strategy、design_token_generation_strategy、generate_color_palette、generate_type_scale、generate_component_variants

Claude スキル（15）

skills/ には、12個のプロンプトをClaude Codeスキルとして収録しているほか、bridge-troubleshooting（接続の診断）、figjam-boards（FigJamの付箋、図形、表、コネクター、自動配置）、editor-compatibility（Figma/FigJam/Slidesのツールマトリックス）も含まれています。プラグインマーケットプレイス経由で自動的にインストールされます。それ以外の場合は、skills/ をプロジェクトの .claude/skills/ にコピーしてください。

開発

make test      # cargo test + plugin bun test
make build     # release binary + plugin dist

• CI：すべての PR で、fmt + clippy + テスト（linux amd64/arm64、windows、macos）+ プラグインの型チェック／テスト／ビルドを実行します。

• リリース：main への Conventional Commits（feat:、fix:）を受けて、release-please がバージョン更新 PR（Cargo.toml、Cargo.lock、npm/package.json、CHANGELOG）を作成します。これをマージすると vX.Y.Z タグが付けられ、同じワークフローで5つのバイナリと plugin.zip をビルドし、npm に公開して、マルチアーキテクチャイメージを ghcr.io/jirayusueb/figma-mcp-rs にプッシュします。既存のタグでリリースビルドを再実行するには、gh workflow run "Release please" -f tag=vX.Y.Z を実行します。

• サーバー：Rust（tokio、axum、rmcp）。プラグイン：TypeScript + SolidJS。Vite でビルドされます（UI は dist/index.html にインライン化、コアは IIFE 形式の dist/code.js）。

• ツールチェーン：Bun 1.4.2、TypeScript 7。

• ワイヤープロトコル（ブリッジの WebSocket フレーム、フォロワーの /rpc）は Go 版の参照実装との互換性が保たれているため、このサーバーは元の figma-mcp-go プラグインでも動作します。

クレジット

vkhanhqui による figma-mcp-go のアーキテクチャとツール設計をフォークし、Rust に移植。SolidJS プラグインと FigJam にも対応しています。

関連プロジェクト

• vkhanhqui/figma-mcp-go — この移植版が準拠する Go 版の参照実装
• alvinindra/figma-mcp-rust — 同じサーバーの別の Rust 移植版
• grab/cursor-talk-to-figma-mcp — この系譜の元となったプラグインブリッジ方式
• gethopp/figma-mcp-bridge — 代替のプラグインブリッジ

ライセンス

MIT