プロトタイプ · プレビュー版:公式レジストリのすべてのサーバーを掲載し、30分ごとに同期しています。Google でログインするとレビューを書けます。
PopNx MCPAIを使う人のためのMCPサーバー · やさしい言葉で解説

Layerbridge

作者:muradyfバージョン 0.3.0i★ 1 (リポジトリ全体のスター)iパソコンで動く
レジストリ名io.github.muradyf/layerbridge

インストール方法

What it does

Read, edit and export the Figma file open in a local plugin. No REST API, no rate limits.

  • Connects パソコンで動く
  • Account or key Needs FIGMA_ACCESS_TOKEN
  • Category デザイン・画像・音声

インストール

使っているAIアプリを選んで、設定をコピーしてください。

チェック 3/3 合格 · あなたのパソコンで動きます

まず:どの AI を使っていますか?

使っているアプリを選ぶと、下に手順が表示されます。

Claude につなげますが、先に準備が必要です

Layerbridge のキーが必要です(提供元のサイトで作成) · 先にパソコンへ Node.js を入れてください(1 回だけ) · パソコン版 Claude アプリ(Windows または Mac)のみ。Web やスマホでは使えません

  1. Node.js を入れる

    1 回だけ。Node.js が必要なすべてのサーバーで使えます

    Node.js のダウンロードページを開く ↗

  2. Layerbridge に登録してキーを作る

    提供元のサイトで登録し、次の手順で使う API キーを作ります。料金や無料プランは提供元のサイトで確認してください。

    Layerbridge のサイトを開く ↗

  3. パソコン版 Claude アプリの設定ファイルを開く

    SettingsDeveloperEdit Config

  4. この設定を貼り付けて保存

    {
      "mcpServers": {
        "layerbridge": {
          "command": "npx",
          "args": [
            "-y",
            "layerbridge"
          ],
          "env": {
            "FIGMA_BRIDGE_PORT": "your-value",
            "FIGMA_BRIDGE_OUTPUT_ROOTS": "your-value",
            "FIGMA_ACCESS_TOKEN": "your-value",
            "FIGMA_BRIDGE_ALLOW_SCRIPTS": "your-value"
          }
        }
      }
    }

    キーはアプリの入力欄にだけ貼り付け、チャットに貼ったり人に送ったりしないでください

  5. Claude を終了してもう一度開く

  6. 試してみる

    Layerbridge を使って、私に何ができるか教えて、1 つやってみせて

    ✓ Claude が Layerbridge を使っていると言うか、回答に Layerbridge のツール名が出れば接続成功です

メニュー名は 2026年11月11日 に Anthropic のヘルプページで確認 · アプリのバージョンにより画面が少し違うことがあります

ChatGPT はまだ Layerbridge につなげません

Layerbridge はパソコンに入れて使うものですが、ChatGPT は Web 上で動くサーバーにしかつなげません

代わりにできること

A · Layerbridge につなげるアプリを使う

  • Layerbridge のキーが必要です(提供元のサイトで作成) · 先にパソコンへ Node.js を入れてください(1 回だけ) · パソコン版 Claude アプリ(Windows または Mac)のみ。Web やスマホでは使えません
  • Layerbridge のキーが必要です(提供元のサイトで作成) · 先にパソコンへ Node.js を入れてください(1 回だけ)
  • Layerbridge のキーが必要です(提供元のサイトで作成) · 先にパソコンへ Node.js を入れてください(1 回だけ)
  • Layerbridge のキーが必要です(提供元のサイトで作成) · 先にパソコンへ Node.js を入れてください(1 回だけ)

B · デザイン・画像・音声 の中で ChatGPT につなげる別のサーバー

同じカテゴリでよく使われているものから、キーなしでアドレスだけでつなげるものを選びました

Claude Code につなげますが、先に準備が必要です

Layerbridge のキーが必要です(提供元のサイトで作成) · 先にパソコンへ Node.js を入れてください(1 回だけ)

  1. Node.js を入れる

    1 回だけ。Node.js が必要なすべてのサーバーで使えます

    Node.js のダウンロードページを開く ↗

  2. Layerbridge に登録してキーを作る

    提供元のサイトで登録し、次の手順で使う API キーを作ります。料金や無料プランは提供元のサイトで確認してください。

    Layerbridge のサイトを開く ↗

  3. ターミナルを開く

    Mac:Command+スペースで Terminal と入力 · Windows:PowerShell を開く

  4. このコマンドを貼り付けて Enter

    claude mcp add --scope user layerbridge --env FIGMA_BRIDGE_PORT=your-value --env FIGMA_BRIDGE_OUTPUT_ROOTS=your-value --env FIGMA_ACCESS_TOKEN=your-value --env FIGMA_BRIDGE_ALLOW_SCRIPTS=your-value -- npx -y layerbridge

    Enter の前に「your-value」を自分のキーに書き換えてください

    キーはアプリの入力欄にだけ貼り付け、チャットに貼ったり人に送ったりしないでください

  5. Claude Code で /mcp と入力

    Layerbridge が一覧にあり、接続済みと表示されれば OK です

  6. 試してみる

    Layerbridge を使って、私に何ができるか教えて、1 つやってみせて

    ✓ Claude Code が Layerbridge を使っていると言うか、回答に Layerbridge のツール名が出れば接続成功です

メニュー名は 2026年11月11日 に Anthropic のヘルプページで確認 · アプリのバージョンにより画面が少し違うことがあります

Cursor につなげますが、先に準備が必要です

Layerbridge のキーが必要です(提供元のサイトで作成) · 先にパソコンへ Node.js を入れてください(1 回だけ)

  1. Node.js を入れる

    1 回だけ。Node.js が必要なすべてのサーバーで使えます

    Node.js のダウンロードページを開く ↗

  2. Layerbridge に登録してキーを作る

    提供元のサイトで登録し、次の手順で使う API キーを作ります。料金や無料プランは提供元のサイトで確認してください。

    Layerbridge のサイトを開く ↗

  3. このボタンで Cursor を開く

    Cursor で開く

    Cursor がインストールの確認をするので Install を押します

  4. キーを入力

    Layerbridge の設定で FIGMA_BRIDGE_PORT, FIGMA_BRIDGE_OUTPUT_ROOTS, FIGMA_ACCESS_TOKEN, FIGMA_BRIDGE_ALLOW_SCRIPTS が空です。自分のキーを入れて保存します

    キーはアプリの入力欄にだけ貼り付け、チャットに貼ったり人に送ったりしないでください

  5. Cursor の AI チャットを Agent モードで開く

  6. 試してみる

    Layerbridge を使って、私に何ができるか教えて、1 つやってみせて

    ✓ Cursor が Layerbridge を使っていると言うか、回答に Layerbridge のツール名が出れば接続成功です

メニュー名は 2026年11月11日 に Cursor のヘルプページで確認 · アプリのバージョンにより画面が少し違うことがあります

VS Code につなげますが、先に準備が必要です

Layerbridge のキーが必要です(提供元のサイトで作成) · 先にパソコンへ Node.js を入れてください(1 回だけ)

  1. Node.js を入れる

    1 回だけ。Node.js が必要なすべてのサーバーで使えます

    Node.js のダウンロードページを開く ↗

  2. Layerbridge に登録してキーを作る

    提供元のサイトで登録し、次の手順で使う API キーを作ります。料金や無料プランは提供元のサイトで確認してください。

    Layerbridge のサイトを開く ↗

  3. このボタンで VS Code を開く

    VS Code で開く

    VS Code がインストールの確認をするので Install を押します

  4. キーを入力

    Layerbridge の設定で FIGMA_BRIDGE_PORT, FIGMA_BRIDGE_OUTPUT_ROOTS, FIGMA_ACCESS_TOKEN, FIGMA_BRIDGE_ALLOW_SCRIPTS が空です。自分のキーを入れて保存します

    キーはアプリの入力欄にだけ貼り付け、チャットに貼ったり人に送ったりしないでください

  5. VS Code の AI チャットを Agent モードで開く

  6. 試してみる

    Layerbridge を使って、私に何ができるか教えて、1 つやってみせて

    ✓ VS Code が Layerbridge を使っていると言うか、回答に Layerbridge のツール名が出れば接続成功です

メニュー名は 2026年11月11日 に VS Code のヘルプページで確認 · アプリのバージョンにより画面が少し違うことがあります

Windsurf、Zed、Gemini CLI など MCP を使える他のアプリは追加方法がそれぞれ違います。アプリ一覧で確認してください

MCP を使えるアプリをすべて見る →

JSON 設定は下の「開発者向け」にあります

つまずいたら?Layerbridge を使っている人に聞いてみましょう💬 ディスカッション →
開発者向け:ターミナルのコマンドと JSON 設定

パソコンにインストール

Claude Code

claude mcp add --scope user layerbridge --env FIGMA_BRIDGE_PORT=your-value --env FIGMA_BRIDGE_OUTPUT_ROOTS=your-value --env FIGMA_ACCESS_TOKEN=your-value --env FIGMA_BRIDGE_ALLOW_SCRIPTS=your-value -- npx -y layerbridge

Claude Desktop (claude_desktop_config.json)

{
  "mcpServers": {
    "layerbridge": {
      "command": "npx",
      "args": [
        "-y",
        "layerbridge"
      ],
      "env": {
        "FIGMA_BRIDGE_PORT": "your-value",
        "FIGMA_BRIDGE_OUTPUT_ROOTS": "your-value",
        "FIGMA_ACCESS_TOKEN": "your-value",
        "FIGMA_BRIDGE_ALLOW_SCRIPTS": "your-value"
      }
    }
  }
}

Cursor (~/.cursor/mcp.json)

{
  "mcpServers": {
    "layerbridge": {
      "command": "npx",
      "args": [
        "-y",
        "layerbridge"
      ],
      "env": {
        "FIGMA_BRIDGE_PORT": "your-value",
        "FIGMA_BRIDGE_OUTPUT_ROOTS": "your-value",
        "FIGMA_ACCESS_TOKEN": "your-value",
        "FIGMA_BRIDGE_ALLOW_SCRIPTS": "your-value"
      }
    }
  }
}

VS Code (mcp.json)

{
  "servers": {
    "layerbridge": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "layerbridge"
      ],
      "env": {
        "FIGMA_BRIDGE_PORT": "your-value",
        "FIGMA_BRIDGE_OUTPUT_ROOTS": "your-value",
        "FIGMA_ACCESS_TOKEN": "your-value",
        "FIGMA_BRIDGE_ALLOW_SCRIPTS": "your-value"
      }
    }
  }
}

自分で入力する値

  • FIGMA_BRIDGE_PORT env
    Local port the Figma plugin connects to; choose the same port in the plugin panel
  • FIGMA_BRIDGE_OUTPUT_ROOTS env
    Extra folders export tools may write to (; on Windows, : elsewhere). Default: working directory only
  • FIGMA_ACCESS_TOKEN 秘密 env
    Optional Figma personal access token; enables REST tools (comments, versions, team files)
  • FIGMA_BRIDGE_ALLOW_SCRIPTS env
    Allow the run_script tool to execute Plugin API code in the open file

この設定は、作者のレジストリ登録情報から作成しています。READMEと違う場合は、READMEに従ってください。

ひと目でわかる

GitHubスターi
1 (リポジトリ全体のスター)
このリポジトリには複数の MCP があり、スターは順位で1件だけ数えます
週あたりのダウンロードi
43/週
接続方法
パソコンで動く
最新バージョンi
0.3.0
レジストリ公開日i
2026年9月14日
コードの最終更新i
2026年9月14日
作者
muradyf
パッケージ
npm: layerbridge
ウェブサイト
github.com
レジストリでの状態
有効

使えるアプリ

このサーバーのつなぎ方と、各アプリの公式ドキュメントに基づきます。2026年11月10日に確認。

パソコン上で動かせるアプリ

ClaudeGooseLM StudioMsty StudioCherry StudioCursorVS Code + GitHub CopilotVisual StudioWindsurf (Devin Desktop)ZedKiroClineContinueJetBrains AI AssistantClaude CodeCodex CLIGemini CLIOpenCodenodecodeWarpLibreChatRaycast

すべてのアプリと長所・短所 →

できること

パソコンで動くサーバーです。インストールすると、ツール一覧がAIアプリに表示されます。

基本チェックi

誰でも見られる情報をチェックしており、コードは読んでいません。当てはまらない項目は数に入れていません。 · 2026年11月12日にチェック

  • ✓ 合格

    作者とリポジトリが一致

    レジストリ名は、リポジトリを所有するGitHubアカウント muradyf で確認済みです

  • ✓ 合格

    今もメンテナンスされている

    コードの最終更新:2 か月前

  • ✓ 合格

    ライセンスがある

    MITを使用

  • – 対象外

    エンドポイントが応答する

    これはパソコンで動くため、インターネット上のエンドポイントはありません

  • – 対象外

    OAuthでサインイン

    パソコンで動き、代わりにローカルの設定を使います

  • … 未チェック

    ツールの説明に隠れた指示がない

    パソコンで動くサーバーです。ツール一覧を読み取れるのは、インターネット上のエンドポイントがある場合だけです

話し合い

質問、コツの共有、使えないことの報告ができます。「役に立った」の多い順です。

まだ投稿はありません。最初の質問や共有をどうぞ。

ここの投稿は利用者によるもので、PopNx チームのものではありません。

Google でログインして投稿

ユーザーレビュー

まだレビューはありません

Google でログインしてレビューを書く

デザイン・画像・音声のほかのサーバーとの比較i

  • このカテゴリのほかの2970件のうち0%よりスターが多い
  • このカテゴリのほかの2970件のうち30%より最近レジストリに公開
  • 基本チェックの結果が、このカテゴリのほかの2970件のうち100%と同じかそれ以上

レジストリでこのカテゴリにある有効なすべてのサーバーと比較しています。スターは、公開者がリポジトリの所有者である場合だけ数えます。

よくある質問

Layerbridgeは安全ですか?

当てはまる基本チェック3項目のうち3項目に合格しました。コードは読んでいません。キーやトークンを追加する前に、サーバーがどんなアクセスを求めているかを確認し、必要な権限だけを持つキーを使ってください。

どんなキーやコードが必要ですか?

入力が必要なもの:FIGMA_ACCESS_TOKEN

パソコンで動きますか、それともクラウドですか?

あなたのパソコンで動きます。必要なときにAIアプリが起動し、データは作者のサーバーを通りません(サーバー自体がオンラインサービスを呼び出す場合を除きます)。

今もメンテナンスされていますか?

GitHubリポジトリの最終更新は2 か月前、最新バージョン(0.3.0)がレジストリに届いたのは2 か月前です。

どのアプリで使えますか?

Claude Desktop、Claude Code、Cursor、VS CodeなどのMCP対応アプリで使えます。パソコンにNode.jsも必要です。

代わりに使えるものは?

同じカテゴリには:Figma Context MCP, AutoClip, Next AI Draw.io

同じカテゴリのほかの候補

同じカテゴリで、ほかの作者が作ったサーバー。スターの多い順。

カードの見方:↓ 週あたりのダウンロードi★ GitHubスターi3つの柱:レビュー · チェック · 利用状況i更新=最新バージョンをレジストリに公開した日i

Figma Context MCP

Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.

作者:GLips広く使われている↓ 15.2万/週★ 1.6万5 か月前更新

パソコンで動く

AutoClip

Clip long videos into short clips with covers and captions. Local CLI and MCP.

作者:zhouxiaoka広く使われている↓ 205/週★ 1万15 日前更新

パソコンで動く

Next AI Draw.io

draw.io diagrams your AI agent draws on a live browser canvas that you can also edit by hand

作者:DayuanJiang広く使われている↓ 2.2万/週★ 3.7万 リポジトリ全体のスター5 日前更新

パソコンで動く

作者のREADME

リポジトリにREADMEが見つかりません