MCP-UI-Org/mcp-ui

What it solves

mcp-ui provides a standardized way to deliver interactive web interfaces for AI tools using the Model Context Protocol (MCP). It solves the problem of AI agents being limited to text-only responses by allowing servers to link tools to rich, sandboxed UI components that can be rendered by a compatible host.

How it works

The project implements the MCP Apps standard, which links tools to their UIs via a _meta.ui.resourceUri.

• Server-side: Developers use SDKs (available in TypeScript, Python, and Ruby) to create UI resources (such as raw HTML or external URLs) and register them. When a tool is called, the server provides a URI that the host can use to fetch the UI content.
• Client-side: Hosts use the @mcp-ui/client SDK to render these resources using components like AppRenderer or UIResourceRenderer, which execute the remote code inside a sandboxed <iframe> for security.
• Interactivity: UI components can communicate back to the agent via a postMessage protocol, allowing buttons or inputs in the UI to trigger tool calls or other actions in the host.
• Adapters: Platform-specific adapters translate the open MCP-UI protocol into host-specific APIs (e.g., for ChatGPT's Apps SDK).

Who it’s for

• MCP Server Developers: Those building tools for AI agents who want to provide a visual, interactive experience instead of just text.
• MCP Host Developers: Developers building AI chat interfaces or IDEs that need a standardized way to render third-party tool UIs.

Highlights

• Multi-language Support: Server SDKs for TypeScript, Python, and Ruby.
• Security-First: All remote UI content is executed in sandboxed iframes.
• Standardized: Fully compliant with the MCP Apps specification.
• Cross-Platform: Includes adapters to ensure widgets work across different AI hosts (e.g., Claude, ChatGPT, Goose).
• Flexible Rendering: Supports raw HTML, external URLs, and Remote-DOM.