MCP-UI-Org/mcp-ui

これは何？

主な機能

• 01MCPホスト向けに、ui:// URIとtext/html MIMEタイプを持つUIリソースを作成
• 02MCP Appsパターンを使い、_meta.ui.resourceUriでツールからUIへリンク
• 03ReactのAppRendererおよびUIResourceRendererコンポーネントとWeb Componentを提供
• 04サンドボックス化されたiframe内でUIコンテンツを表示
• 05TypeScript、Ruby、Python向けのサーバーSDKを提供
• 06ChatGPT Apps SDKとの連携を可能にするアダプターを同梱

ユースケース

• MCPサーバーにフォームやダッシュボードウィジェットを追加し、AIアシスタントに表示させる
• サードパーティのサーバーからツールUIを表示するMCPホストを構築する
• ユーザーがクリックするとツールを呼び出すインタラクティブなコントロールを返す
• MCP駆動のウィジェットをRubyまたはPythonのバックエンドに統合する

クイックスタート

1. 1

   npm で TypeScript のサーバーおよびクライアントパッケージをインストールします

   npm install @mcp-ui/server @mcp-ui/client
2. 2

   または、pip で Python のサーバー SDK をインストールします

   pip install mcp-ui-server
3. 3

   Getting Started の例に従い、UI リソースを作成し、_meta.ui.resourceUri を使ってツールにリンクします

使う前に知っておきたいこと

• !表示には、MCP Apps または従来の MCP-UI renderer に対応したホストが必要です。
• !UI を表示するには、AppRenderer に sandbox proxy URL を設定する必要があります。
• !ホスト固有のアダプターの一部はブリッジとして提供されており、ホストがオープン仕様を採用すると不要になる場合があります。

トピック

よくある質問

mcp-ui とは？

MCPツールが返し、ホストが表示できるインタラクティブなUIリソースを構築するためのTypeScript、Ruby、Python SDK。 mcp-uiは、Model Context Protocol（MCP）で公開されるツールにインタラクティブなユーザーインターフェースを追加するSDKです。サーバーがUIリソースを作成し、通常はui:// URIでHTMLを提供します。MCPホストはそれを取得してツールの実行結果の横に表示できるため、AIアシスタントはテキストだけでなくウィジェットも提示できます。

mcp-ui は無料で使えますか？ライセンスは？

mcp-ui は Apache-2.0 ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

mcp-ui は今もメンテナンスされていますか？

半年以内に更新あり。mcp-ui の最終コミットは 2026年9月16日 です。

mcp-ui は何に使えますか？

MCPサーバーにフォームやダッシュボードウィジェットを追加し、AIアシスタントに表示させる サードパーティのサーバーからツールUIを表示するMCPホストを構築する ユーザーがクリックするとツールを呼び出すインタラクティブなコントロールを返す MCP駆動のウィジェットをRubyまたはPythonのバックエンドに統合する

mcp-ui のインストール方法は？

npm で TypeScript のサーバーおよびクライアントパッケージをインストールします: npm install @mcp-ui/server @mcp-ui/client または、pip で Python のサーバー SDK をインストールします: pip install mcp-ui-server Getting Started の例に従い、UI リソースを作成し、_meta.ui.resourceUri を使ってツールにリンクします

mcp-ui はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/MCP-UI-Org/mcp-ui