Vibr MCP

Vibr MCPは、あなたのコンピューターで実行する小さなサーバーです。Claude Code、Cursor、Claude DesktopなどのエージェントがVibrを操作できるようになります。プロトタイプの一覧表示、画面の構築と手直し、Figmaファイルのインポート、テーマのデザイントークンとしての読み取り、プロトタイプのプロジェクトへのエクスポートができます。

ライブラリとキーはブラウザーにあるため、作業は接続したVibrのタブで行われます。エージェントが依頼し、タブがあなたのデザインシステムとモデルのキーで作業します。自分でリクエストを入力したときと同じです。

セットアップする

Node 20以降が必要です。Claude Codeでは、サーバーを一度追加します。

claude mcp add vibr -- npx -y vibr-mcp

ほかのMCPクライアントでは、同じコマンドを設定ファイルに記述します。

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

タブを接続する

1. エージェントにVibrへの接続を頼みます。サーバーがあなたのコンピューター上に表示するページへのリンクが返されます。
2. Vibrを使っているブラウザーでリンクを開き、Open Vibr を選択します。Vibrが専用のウィンドウで開き、あなたのライブラリとキーがそのまま使えます。Vibrにまだキーがない場合は、そこで追加します。
3. このコンピューターのMCPがそのウィンドウで作業してよいか、Vibrが尋ねます。許可 を選択します。
4. ウィンドウの下部に MCPに接続済み と表示されます。いつでも 切断 を選択して終了できます。

エージェントの作業中は、サーバーのページとVibrのウィンドウを開いたままにしてください。各リンクはサーバーの1回のセッションで有効です。サーバーが再起動したら、新しいリンクを頼んでください。

できること

• 一覧表示と読み取り： 保存済みのプロトタイプ、プロトタイプのコードとリクエスト、ライブラリのメンション、タブの設定（プロバイダー、モデル、デザインシステム。キーは決して含みません）。
• 構築： リクエストを計画、構築、チェック、レビュー、修復の各ステップに通し、新しいプロトタイプとして、または既存のプロトタイプの改訂版として作成し、ライブラリに保存します。あなたのキーを使うため、Vibrで同じリクエストをしたときと同じ費用がかかります。
• Figmaからインポート： Send to Vibrプラグインの.vibr-figma.jsonファイルをインポートし、そのフレームをリンクした画面として構築します。Figmaからインポートをご覧ください。
• テーマの読み取り： テーマをCSSカスタムプロパティまたはデザイントークンとして、ライトとダークの役割とともに読み取ります。
• エクスポート： プロトタイプをフォルダーに、1つのページ、リンクしたフロー、またはReactのソースとして書き出します。指示がない限りファイルを置き換えることはなく、指定したフォルダーの外に書き込むこともありません。

プライバシーと安全性

• キーがタブの外に出ることはありません。サーバーがキーを見ることはなく、リクエストはいつもどおりタブからモデルのプロバイダーに送られます。
• サーバーは127.0.0.1でのみ待ち受けます。サーバーはブラウザー内の自身のページを通じてVibrに作業を渡すため、vibr.artがあなたのコンピューターに接続することはありません。
• Vibrが作業を受け取るのは、Vibrを開いたページからだけで、サーバーのリンクに含まれるランダムな使い捨てコードがある場合だけ、しかもあなたが 許可 を選択した後だけです。
• ライブラリの内容はデータとしてエージェントに届きます。プロトタイプのテキストやインポートしたファイルが、エージェントに指示を与えることはできません。ただし、エージェントがそれを指示として扱う場合は別です。そのため、エージェントが構築したものは、ほかの下書きと同じようにレビューしてください。

詳しくはキー、プライバシー、ストレージをご覧ください。

設定

• VIBR_MCP_PORT：あなたのコンピューター上のポート（使用中でなければ4517）。
• VIBR_MCP_APP：リンクで開くVibrのページ（Vibrを自分で動かしていなければ https://vibr.art/ ）。

トラブルシューティング

• Vibrが接続されない： Vibrのウィンドウで 許可 を選択したか、サーバーのページがまだ開いているかを確認してください。ブラウザーがウィンドウをブロックした場合は、そのページのポップアップを許可し、もう一度 Open Vibr を選択してください。
• エージェントが、接続されたタブがないと言う： サーバーが再起動したか、ウィンドウが閉じられました。新しいリンクを頼んで開いてください。
• 構築が失敗する： Vibrのウィンドウを開いてください。リクエストを入力したときと同じように、実行の各ステップが表示されます。