{"id":33914678,"url":"https://github.com/mcp-ui-org/mcp-ui","last_synced_at":"2026-03-09T08:02:16.999Z","repository":{"id":293733326,"uuid":"983113668","full_name":"MCP-UI-Org/mcp-ui","owner":"MCP-UI-Org","description":"UI over MCP. Create next-gen UI experiences with the protocol and SDK!","archived":false,"fork":false,"pushed_at":"2026-03-09T01:53:31.000Z","size":4066,"stargazers_count":4502,"open_issues_count":43,"forks_count":330,"subscribers_count":38,"default_branch":"main","last_synced_at":"2026-03-09T05:46:39.558Z","etag":null,"topics":["ai","frontend","llm","mcp","ui","web"],"latest_commit_sha":null,"homepage":"https://mcpui.dev","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/MCP-UI-Org.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-05-13T22:41:43.000Z","updated_at":"2026-03-09T05:40:30.000Z","dependencies_parsed_at":"2025-07-14T19:16:49.368Z","dependency_job_id":"c6d61b0e-0338-414d-9d26-6e9ca18f165b","html_url":"https://github.com/MCP-UI-Org/mcp-ui","commit_stats":null,"previous_names":["idosal/mcp-ui","mcp-ui-org/mcp-ui"],"tags_count":97,"template":false,"template_full_name":null,"purl":"pkg:github/MCP-UI-Org/mcp-ui","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MCP-UI-Org%2Fmcp-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MCP-UI-Org%2Fmcp-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MCP-UI-Org%2Fmcp-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MCP-UI-Org%2Fmcp-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MCP-UI-Org","download_url":"https://codeload.github.com/MCP-UI-Org/mcp-ui/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MCP-UI-Org%2Fmcp-ui/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30287447,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-09T02:57:19.223Z","status":"ssl_error","status_checked_at":"2026-03-09T02:56:26.373Z","response_time":61,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ai","frontend","llm","mcp","ui","web"],"created_at":"2025-12-12T06:36:17.118Z","updated_at":"2026-03-09T08:02:16.977Z","avatar_url":"https://github.com/MCP-UI-Org.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## 📦 Model Context Protocol UI SDK\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"250\" alt=\"image\" src=\"https://github.com/user-attachments/assets/65b9698f-990f-4846-9b2d-88de91d53d4d\" /\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@mcp-ui/server\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@mcp-ui/server?label=server\u0026color=green\" alt=\"Server Version\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/@mcp-ui/client\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/@mcp-ui/client?label=client\u0026color=blue\" alt=\"Client Version\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://rubygems.org/gems/mcp_ui_server\"\u003e\u003cimg src=\"https://img.shields.io/gem/v/mcp_ui_server\" alt=\"Ruby Server SDK Version\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://pypi.org/project/mcp-ui-server/\"\u003e\u003cimg src=\"https://img.shields.io/pypi/v/mcp-ui-server?label=python\u0026color=yellow\" alt=\"Python Server SDK Version\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://discord.gg/CEAG4KW7ZH\"\u003e\u003cimg src=\"https://img.shields.io/discord/1401195140436983879?logo=discord\u0026label=discord\" alt=\"Discord\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://gitmcp.io/idosal/mcp-ui\"\u003e\u003cimg src=\"https://img.shields.io/endpoint?url=https://gitmcp.io/badge/idosal/mcp-ui\" alt=\"MCP Documentation\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"#-whats-mcp-ui\"\u003eWhat's mcp-ui?\u003c/a\u003e •\n  \u003ca href=\"#-core-concepts\"\u003eCore Concepts\u003c/a\u003e •\n  \u003ca href=\"#-installation\"\u003eInstallation\u003c/a\u003e •\n  \u003ca href=\"#-getting-started\"\u003eGetting Started\u003c/a\u003e •\n  \u003ca href=\"#-walkthrough\"\u003eWalkthrough\u003c/a\u003e •\n  \u003ca href=\"#-examples\"\u003eExamples\u003c/a\u003e •\n  \u003ca href=\"#-supported-hosts\"\u003eSupported Hosts\u003c/a\u003e •\n  \u003ca href=\"#-security\"\u003eSecurity\u003c/a\u003e •\n  \u003ca href=\"#-roadmap\"\u003eRoadmap\u003c/a\u003e •\n  \u003ca href=\"#-contributing\"\u003eContributing\u003c/a\u003e •\n  \u003ca href=\"#-license\"\u003eLicense\u003c/a\u003e\n\u003c/p\u003e\n\n----\n\n**`mcp-ui`** pioneered the concept of interactive UI over [MCP](https://modelcontextprotocol.io/introduction), enabling rich web interfaces for AI tools. Alongside Apps SDK, the patterns developed here directly influenced the [MCP Apps](https://github.com/modelcontextprotocol/ext-apps) specification, which standardized UI delivery over the protocol.\n\nThe `@mcp-ui/*` packages implement the MCP Apps standard. `@mcp-ui/client` is the recommended SDK for MCP Apps Hosts.\n\n\u003e *The @mcp-ui/* packages are fully compliant with the MCP Apps specification and ready for production use.*\n\n\u003cp align=\"center\"\u003e\n  \u003cvideo src=\"https://github.com/user-attachments/assets/7180c822-2dd9-4f38-9d3e-b67679509483\"\u003e\u003c/video\u003e\n\u003c/p\u003e\n\n## 💡 What's `mcp-ui`?\n\n`mcp-ui` is an SDK implementing the [MCP Apps](https://github.com/modelcontextprotocol/ext-apps) standard for UI over MCP. It provides:\n\n* **`@mcp-ui/server` (TypeScript)**: Create UI resources with `createUIResource`. Works with `registerAppTool` and `registerAppResource` from `@modelcontextprotocol/ext-apps/server`.\n* **`@mcp-ui/client` (TypeScript)**: Render tool UIs with `AppRenderer` (MCP Apps) or `UIResourceRenderer` (legacy MCP-UI hosts).\n* **`mcp_ui_server` (Ruby)**: Create UI resources in Ruby.\n* **`mcp-ui-server` (Python)**: Create UI resources in Python.\n\nThe MCP Apps pattern links tools to their UIs via `_meta.ui.resourceUri`. Hosts fetch and render the UI alongside tool results.\n\n## ✨ Core Concepts\n\n### MCP Apps Pattern (Recommended)\n\nThe MCP Apps standard links tools to their UIs via `_meta.ui.resourceUri`:\n\n```ts\nimport { registerAppTool, registerAppResource } from '@modelcontextprotocol/ext-apps/server';\nimport { createUIResource } from '@mcp-ui/server';\n\n// 1. Create UI resource\nconst widgetUI = createUIResource({\n  uri: 'ui://my-server/widget',\n  content: { type: 'rawHtml', htmlString: '\u003ch1\u003eWidget\u003c/h1\u003e' },\n  encoding: 'text',\n});\n\n// 2. Register resource handler\nregisterAppResource(server, 'widget_ui', widgetUI.resource.uri, {}, async () =\u003e ({\n  contents: [widgetUI.resource]\n}));\n\n// 3. Register tool with _meta linking\nregisterAppTool(server, 'show_widget', {\n  description: 'Show widget',\n  inputSchema: { query: z.string() },\n  _meta: { ui: { resourceUri: widgetUI.resource.uri } }  // Links tool → UI\n}, async ({ query }) =\u003e {\n  return { content: [{ type: 'text', text: `Query: ${query}` }] };\n});\n```\n\nHosts detect `_meta.ui.resourceUri`, fetch the UI via `resources/read`, and render it with `AppRenderer`.\n\n### UIResource (Wire Format)\n\nThe underlying payload for UI content:\n\n```ts\ninterface UIResource {\n  type: 'resource';\n  resource: {\n    uri: string;       // e.g., ui://component/id\n    mimeType: 'text/html' | 'text/uri-list' | 'application/vnd.mcp-ui.remote-dom';\n    text?: string;      // Inline HTML, external URL, or remote-dom script\n    blob?: string;      // Base64-encoded content\n  };\n}\n```\n\n* **`uri`**: Unique identifier using `ui://` scheme\n* **`mimeType`**: `text/html` for HTML, `text/uri-list` for URLs, `text/html;profile=mcp-app` for MCP Apps\n* **`text` vs. `blob`**: Plain text or Base64-encoded content\n\n### Client Components\n\n#### AppRenderer (MCP Apps)\n\nFor MCP Apps hosts, use `AppRenderer` to render tool UIs:\n\n```tsx\nimport { AppRenderer } from '@mcp-ui/client';\n\nfunction ToolUI({ client, toolName, toolInput, toolResult }) {\n  return (\n    \u003cAppRenderer\n      client={client}\n      toolName={toolName}\n      sandbox={{ url: sandboxUrl }}\n      toolInput={toolInput}\n      toolResult={toolResult}\n      onOpenLink={async ({ url }) =\u003e window.open(url)}\n      onMessage={async (params) =\u003e console.log('Message:', params)}\n    /\u003e\n  );\n}\n```\n\nKey props:\n- **`client`**: Optional MCP client for automatic resource fetching\n- **`toolName`**: Tool name to render UI for\n- **`sandbox`**: Sandbox configuration with proxy URL\n- **`toolInput`** / **`toolResult`**: Tool arguments and results\n- **`onOpenLink`** / **`onMessage`**: Handlers for UI requests\n\n#### UIResourceRenderer (Legacy MCP-UI)\n\nFor legacy hosts that embed resources in tool responses:\n\n```tsx\nimport { UIResourceRenderer } from '@mcp-ui/client';\n\n\u003cUIResourceRenderer\n  resource={mcpResource.resource}\n  onUIAction={(action) =\u003e console.log('Action:', action)}\n/\u003e\n```\n\nProps:\n- **`resource`**: Resource object with `uri`, `mimeType`, and content (`text`/`blob`)\n- **`onUIAction`**: Callback for handling tool, prompt, link, notify, and intent actions\n\nAlso available as a Web Component:\n```html\n\u003cui-resource-renderer\n  resource='{ \"mimeType\": \"text/html\", \"text\": \"\u003ch2\u003eHello!\u003c/h2\u003e\" }'\n\u003e\u003c/ui-resource-renderer\u003e\n```\n\n### Supported Resource Types\n\n#### HTML (`text/html;profile=mcp-app`)\n\nRendered using the internal `\u003cHTMLResourceRenderer /\u003e` component, which displays content inside an `\u003ciframe\u003e`. This is suitable for self-contained HTML.\n\n*   **`mimeType`**: `text/html;profile=mcp-app` (MCP Apps standard)\n\n### UI Action\n\nUI snippets must be able to interact with the agent. In `mcp-ui`, this is done by hooking into events sent from the UI snippet and reacting to them in the host (see `onUIAction` prop). For example, an HTML may trigger a tool call when a button is clicked by sending an event which will be caught handled by the client.\n\n\n### Platform Adapters\n\nMCP-UI SDKs includes adapter support for host-specific implementations, enabling your open MCP-UI widgets to work seamlessly regardless of host. Adapters automatically translate between MCP-UI's `postMessage` protocol and host-specific APIs. Over time, as hosts become compatible with the open spec, these adapters wouldn't be needed.\n\n#### Available Adapters\n\n##### Apps SDK Adapter\n\nFor Apps SDK environments (e.g., ChatGPT), this adapter translates MCP-UI protocol to Apps SDK API calls (e.g., `window.openai`).\n\n**How it Works:**\n- Intercepts MCP-UI `postMessage` calls from your widgets\n- Translates them to appropriate Apps SDK API calls\n- Handles bidirectional communication (tools, prompts, state management)\n- Works transparently - your existing MCP-UI code continues to work without changes\n\n**Usage:**\n\n```ts\nimport { createUIResource } from '@mcp-ui/server';\n\nconst htmlResource = createUIResource({\n  uri: 'ui://greeting/1',\n  content: { \n    type: 'rawHtml', \n    htmlString: `\n      \u003cbutton onclick=\"window.parent.postMessage({ type: 'tool', payload: { toolName: 'myTool', params: {} } }, '*')\"\u003e\n        Call Tool\n      \u003c/button\u003e\n    ` \n  },\n  encoding: 'text',\n  // Enable adapters\n  adapters: {\n    appsSdk: {\n      enabled: true,\n      config: ...\n    }\n    // Future adapters can be enabled here\n  }\n});\n```\n\nThe adapter scripts are automatically injected into your HTML content and handle all protocol translation.\n\n**Supported Actions:**\n- ✅ **Tool calls** - `{ type: 'tool', payload: { toolName, params } }`\n- ✅ **Prompts** - `{ type: 'prompt', payload: { prompt } }`\n- ✅ **Intents** - `{ type: 'intent', payload: { intent, params } }` (converted to prompts)\n- ✅ **Notifications** - `{ type: 'notify', payload: { message } }`\n- ✅ **Render data** - Access to `toolInput`, `toolOutput`, `widgetState`, `theme`, `locale`\n- ⚠️ **Links** - `{ type: 'link', payload: { url } }` (may not be supported, returns error in some environments)\n\n#### Advanced Usage\n\nYou can manually wrap HTML with adapters or access adapter scripts directly:\n\n```ts\nimport { wrapHtmlWithAdapters, getAppsSdkAdapterScript } from '@mcp-ui/server';\n\n// Manually wrap HTML with adapters\nconst wrappedHtml = wrapHtmlWithAdapters(\n  '\u003cbutton\u003eClick me\u003c/button\u003e',\n  {\n    appsSdk: {\n      enabled: true,\n      config: { intentHandling: 'ignore' }\n    }\n  }\n);\n\n// Get a specific adapter script\nconst appsSdkScript = getAppsSdkAdapterScript({ timeout: 60000 });\n```\n\n## 🏗️ Installation\n\n### TypeScript\n\n```bash\n# using npm\nnpm install @mcp-ui/server @mcp-ui/client\n\n# or pnpm\npnpm add @mcp-ui/server @mcp-ui/client\n\n# or yarn\nyarn add @mcp-ui/server @mcp-ui/client\n```\n\n### Ruby\n\n```bash\ngem install mcp_ui_server\n```\n\n### Python\n\n```bash\n# using pip\npip install mcp-ui-server\n\n# or uv\nuv add mcp-ui-server\n```\n\n## 🚀 Getting Started\n\nYou can use [GitMCP](https://gitmcp.io/idosal/mcp-ui) to give your IDE access to `mcp-ui`'s latest documentation!\n\n### TypeScript (MCP Apps Pattern)\n\n1. **Server-side**: Create a tool with UI using `_meta.ui.resourceUri`\n\n   ```ts\n   import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js';\n   import { registerAppTool, registerAppResource } from '@modelcontextprotocol/ext-apps/server';\n   import { createUIResource } from '@mcp-ui/server';\n   import { z } from 'zod';\n\n   const server = new McpServer({ name: 'my-server', version: '1.0.0' });\n\n   // Create UI resource\n   const widgetUI = createUIResource({\n     uri: 'ui://my-server/widget',\n     content: { type: 'rawHtml', htmlString: '\u003ch1\u003eInteractive Widget\u003c/h1\u003e' },\n     encoding: 'text',\n   });\n\n   // Register resource handler\n   registerAppResource(server, 'widget_ui', widgetUI.resource.uri, {}, async () =\u003e ({\n     contents: [widgetUI.resource]\n   }));\n\n   // Register tool with _meta linking\n   registerAppTool(server, 'show_widget', {\n     description: 'Show widget',\n     inputSchema: { query: z.string() },\n     _meta: { ui: { resourceUri: widgetUI.resource.uri } }\n   }, async ({ query }) =\u003e {\n     return { content: [{ type: 'text', text: `Query: ${query}` }] };\n   });\n   ```\n\n2. **Client-side**: Render tool UIs with `AppRenderer`\n\n   ```tsx\n   import { AppRenderer } from '@mcp-ui/client';\n\n   function ToolUI({ client, toolName, toolInput, toolResult }) {\n     return (\n       \u003cAppRenderer\n         client={client}\n         toolName={toolName}\n         sandbox={{ url: sandboxUrl }}\n         toolInput={toolInput}\n         toolResult={toolResult}\n         onOpenLink={async ({ url }) =\u003e window.open(url)}\n         onMessage={async (params) =\u003e console.log('Message:', params)}\n       /\u003e\n     );\n   }\n   ```\n\n### Legacy MCP-UI Pattern\n\nFor hosts that don't support MCP Apps yet:\n\n   ```tsx\n   import { UIResourceRenderer } from '@mcp-ui/client';\n\n   \u003cUIResourceRenderer\n     resource={mcpResource.resource}\n     onUIAction={(action) =\u003e console.log('Action:', action)}\n   /\u003e\n   ```\n\n### Python\n\n**Server-side**: Build your UI resources\n\n   ```python\n   from mcp_ui_server import create_ui_resource\n\n   # Inline HTML\n   html_resource = create_ui_resource({\n     \"uri\": \"ui://greeting/1\",\n     \"content\": { \"type\": \"rawHtml\", \"htmlString\": \"\u003cp\u003eHello, from Python!\u003c/p\u003e\" },\n     \"encoding\": \"text\",\n   })\n\n   # External URL\n   external_url_resource = create_ui_resource({\n     \"uri\": \"ui://greeting/2\",\n     \"content\": { \"type\": \"externalUrl\", \"iframeUrl\": \"https://example.com\" },\n     \"encoding\": \"text\",\n   })\n   ```\n\n### Ruby\n\n**Server-side**: Build your UI resources\n\n   ```ruby\n   require 'mcp_ui_server'\n\n   # Inline HTML\n   html_resource = McpUiServer.create_ui_resource(\n     uri: 'ui://greeting/1',\n     content: { type: :raw_html, htmlString: '\u003cp\u003eHello, from Ruby!\u003c/p\u003e' },\n     encoding: :text\n   )\n\n   # External URL\n   external_url_resource = McpUiServer.create_ui_resource(\n     uri: 'ui://greeting/2',\n     content: { type: :external_url, iframeUrl: 'https://example.com' },\n     encoding: :text\n   )\n\n   # remote-dom\n   remote_dom_resource = McpUiServer.create_ui_resource(\n     uri: 'ui://remote-component/action-button',\n     content: {\n       type: :remote_dom,\n       script: \"\n        const button = document.createElement('ui-button');\n        button.setAttribute('label', 'Click me from Ruby!');\n        button.addEventListener('press', () =\u003e {\n          window.parent.postMessage({ type: 'tool', payload: { toolName: 'uiInteraction', params: { action: 'button-click', from: 'ruby-remote-dom' } } }, '*');\n        });\n        root.appendChild(button);\n        \",\n       framework: :react,\n     },\n     encoding: :text\n   )\n   ```\n\n## 🚶 Walkthrough\n\nFor a detailed, simple, step-by-step guide on how to integrate `mcp-ui` into your own server, check out the full server walkthroughs on the [mcp-ui documentation site](https://mcpui.dev):\n\n- **[TypeScript Server Walkthrough](https://mcpui.dev/guide/server/typescript/walkthrough)**\n- **[Ruby Server Walkthrough](https://mcpui.dev/guide/server/ruby/walkthrough)**\n- **[Python Server Walkthrough](https://mcpui.dev/guide/server/python/walkthrough)**\n\nThese guides will show you how to add a `mcp-ui` endpoint to an existing server, create tools that return UI resources, and test your setup with the `ui-inspector`!\n\n## 🌍 Examples\n\n**Client Examples**\n* [Goose](https://github.com/block/goose) - open source AI agent that supports `mcp-ui`.\n* [LibreChat](https://github.com/danny-avila/LibreChat) - enhanced ChatGPT clone that supports `mcp-ui`.\n* [ui-inspector](https://github.com/idosal/ui-inspector) - inspect local `mcp-ui`-enabled servers.\n* [MCP-UI Chat](https://github.com/idosal/scira-mcp-ui-chat) - interactive chat built with the `mcp-ui` client. Check out the [hosted version](https://scira-mcp-chat-git-main-idosals-projects.vercel.app/)!\n* MCP-UI RemoteDOM Playground (`examples/remote-dom-demo`) - local demo app to test RemoteDOM resources\n* MCP-UI Web Component Demo (`examples/wc-demo`) - local demo app to test the Web Component integration in hosts\n\n**Server Examples**\n* **TypeScript**: A [full-featured server](examples/server) that is deployed to a hosted environment for easy testing.\n  * **[`typescript-server-demo`](./examples/typescript-server-demo)**: A simple Typescript server that demonstrates how to generate UI resources.\n  * **server**: A [full-featured Typescript server](examples/server) that is deployed to a hosted Cloudflare environment for easy testing.\n    * **HTTP Streaming**: `https://remote-mcp-server-authless.idosalomon.workers.dev/mcp`\n    * **SSE**: `https://remote-mcp-server-authless.idosalomon.workers.dev/sse`\n* **Ruby**: A barebones [demo server](/examples/ruby-server-demo) that shows how to use `mcp_ui_server` and `mcp` gems together.\n* **Python**: A simple [demo server](/examples/python-server-demo) that shows how to use the `mcp-ui-server` Python package.\n* [XMCP](https://github.com/basementstudio/xmcp/tree/main/examples/mcp-ui) - Typescript MCP framework with `mcp-ui` starter example.\n\nDrop those URLs into any MCP-compatible host to see `mcp-ui` in action. For a supported local inspector, see the [ui-inspector](https://github.com/idosal/ui-inspector).\n\n## 💻 Supported Hosts\n\nThe `@mcp-ui/*` packages work with both MCP Apps hosts and legacy MCP-UI hosts.\n\n### MCP Apps Hosts\n\nThese hosts implement the [MCP Apps specification](https://github.com/modelcontextprotocol/ext-apps) and support tools with `_meta.ui.resourceUri`:\n\n| Host | Notes |\n| :--- | :---- |\n| [Claude](https://www.claude.ai/) | ✅ | ✅ |\n| [VSCode](https://github.com/microsoft/vscode/issues/260218) | |\n| [Postman](https://www.postman.com/) | |\n| [Goose](https://block.github.io/goose/) | |\n| [MCPJam](https://www.mcpjam.com/) | |\n| [LibreChat](https://www.librechat.ai/) | |\n| [mcp-use](https://mcp-use.com/) | |\n| [Smithery](https://smithery.ai/playground) | |\n\n### Legacy MCP-UI Hosts\n\nThese hosts expect UI resources embedded directly in tool responses:\n\n| Host | Rendering | UI Actions | Notes |\n| :--- | :-------: | :--------: | :---- |\n| [Nanobot](https://www.nanobot.ai/) | ✅ | ✅ |\n| [MCPJam](https://www.mcpjam.com/) | ✅ | ✅ |\n| [Postman](https://www.postman.com/) | ✅ | ⚠️ | |\n| [Goose](https://block.github.io/goose/) | ✅ | ⚠️ | |\n| [LibreChat](https://www.librechat.ai/) | ✅ | ⚠️ | |\n| [Smithery](https://smithery.ai/playground) | ✅ | ❌ | |\n| [fast-agent](https://fast-agent.ai/mcp/mcp-ui/) | ✅ | ❌ | |\n\n### Hosts Requiring Adapters\n\n| Host | Protocol | Notes |\n| :--- | :------: | :---- |\n| [ChatGPT](https://chatgpt.com/) | Apps SDK | [Guide](https://mcpui.dev/guide/apps-sdk) |\n\n**Legend:** ✅ Supported · ⚠️ Partial · ❌ Not yet supported\n\n## 🔒 Security\nHost and user security is one of `mcp-ui`'s primary concerns. In all content types, the remote code is executed in a sandboxed iframe.\n\n## 🛣️ Roadmap\n\n- [X] Add online playground\n- [X] Expand UI Action API (beyond tool calls)\n- [X] Support Web Components\n- [X] Support Remote-DOM\n- [ ] Add component libraries (in progress)\n- [ ] Add SDKs for additional programming languages (in progress; Ruby, Python available)\n- [ ] Support additional frontend frameworks\n- [ ] Explore providing a UI SDK (in addition to the client and server one)\n- [ ] Add declarative UI content type\n- [ ] Support generative UI?\n      \n## Core Team\n`mcp-ui` is a project by [Ido Salomon](https://x.com/idosal1), in collaboration with [Liad Yosef](https://x.com/liadyosef).\n\n## 🤝 Contributing\n\nContributions, ideas, and bug reports are welcome! See the [contribution guidelines](https://github.com/idosal/mcp-ui/blob/main/.github/CONTRIBUTING.md) to get started.\n\n## 📄 License\n\nApache License 2.0 © [The MCP-UI Authors](LICENSE)\n\n## Disclaimer\n\nThis project is provided \"as is\", without warranty of any kind. The `mcp-ui` authors and contributors shall not be held liable for any damages, losses, or issues arising from the use of this software. Use at your own risk.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmcp-ui-org%2Fmcp-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmcp-ui-org%2Fmcp-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmcp-ui-org%2Fmcp-ui/lists"}