MCP-UI is a set of server and client SDKs for delivering interactive user interfaces over the Model Context Protocol (MCP). The patterns it introduced fed into the MCP Apps specification, which standardized UI delivery over the protocol, and the @mcp-ui/* packages now implement that specification.
Under the MCP Apps pattern, a server builds a UI resource with createUIResource and links it to a tool through _meta.ui.resourceUri. A host detects that field, fetches the UI with resources/read, and renders it with the AppRenderer component alongside the tool result, passing the tool input and output plus handlers for link and message requests. The earlier pattern, where the resource is embedded directly in the tool response and rendered by UIResourceRenderer, remains supported for hosts that have not adopted MCP Apps; that renderer is also available as a ui-resource-renderer web component.
The wire format is a UIResource: a ui:// URI, the text/html;profile=mcp-app MIME type, and HTML carried either as plain text or Base64-encoded. Remote code runs inside a sandboxed iframe. UI snippets talk back to the agent by posting events the host handles — a button that posts a tool message triggers a tool call, and the onUIAction callback covers tool, prompt, link, notify, and intent actions.
Platform adapters translate those postMessage calls into host-specific APIs so the same widget works across hosts — the Apps SDK adapter maps them to window.openai calls in environments such as ChatGPT, handling tools, prompts, and state bidirectionally without changes to the widget code. Server SDKs exist for TypeScript, Ruby, and Python; the client SDK is TypeScript.
Hosts implementing MCP Apps include Claude, VSCode, Postman, Goose, MCPJam, LibreChat, mcp-use, and Smithery. Hosts on the earlier embedded-resource path include Nanobot and MCPJam with both rendering and UI actions, and Postman, Goose, LibreChat, Smithery, and fast-agent with rendering and partial or absent action support.
Features
- MCP Apps implementation: tools link to their UI through _meta.ui.resourceUri, and hosts fetch and render it beside the tool result
- Server SDKs: @mcp-ui/server for TypeScript, mcp_ui_server for Ruby, and mcp-ui-server for Python, each creating UI resources
- Client SDK: @mcp-ui/client with AppRenderer for MCP Apps hosts and UIResourceRenderer for the earlier embedded-resource pattern
- Web component: ui-resource-renderer renders a resource without a React host
- Wire format: a ui:// URI with the text/html;profile=mcp-app MIME type, carrying HTML as text or Base64
- UI actions: tool, prompt, link, notify, and intent events posted from the snippet and handled by the host
- Content types: inline raw HTML, external URLs loaded in an iframe, and remote-DOM scripts that build components in the host
- Platform adapters: MCP-UI postMessage traffic is translated to host APIs such as window.openai for Apps SDK environments
- Sandboxing: remote code executes in a sandboxed iframe in every content type
- Inspector: ui-inspector and hosted demo servers over HTTP streaming and SSE for testing a server end to end
