What it is
MCP-UI — formalized as the MCP Apps extension (SEP-1865) — lets an MCP server declare UI resources (HTML snippets referenced by a ui:// URI scheme) and attach them to tools. When the tool runs, the host renders the UI in a sandboxed iframe inside the chat or app, and the UI talks back to the host over JSON-RPC via postMessage. It is the first official MCP extension, developed jointly by the MCP-UI project, OpenAI, and Anthropic.
Why it matters
MCP unlocked agents to reach your systems, but until now everything came back as text — a wall of bullet points the user has to squint at. MCP-UI breaks that wall by letting a tool return a real form, chart, card, or booking widget the user can interact with directly. For a Salesforce customer, that means an Agentforce-style agent can surface a Case record, a pipeline chart, or a Close Lost form inline instead of describing them, collapsing what used to be a three-click detour into a single interaction.
Key components
- UI resources declared by the MCP server with the ui:// URI scheme
- Sandboxed iframe rendering on the client — no arbitrary JavaScript execution on the host
- JSON-RPC over postMessage bridge for UI-to-host communication
- Predeclared templates so hosts can audit HTML content before rendering
- Standard MIME type text/html;profile=mcp-app identifying MCP App resources
How it works
- An MCP tool's response references a UI resource by its ui:// URI
- The host fetches the resource (HTML with the text/html;profile=mcp-app MIME type)
- The host renders it in a sandboxed iframe inside the conversation
- User interactions inside the iframe are sent back as JSON-RPC messages, which the host routes to the MCP server
Good to know
Currently supported by Claude, Claude Desktop, VS Code GitHub Copilot, Goose, Postman, and MCPJam. Security is strong by design: every UI runs in an iframe with restricted permissions, and every host-server message is auditable as a JSON-RPC call.
Related terms
MCP (Model Context Protocol)
Anthropic's open standard for connecting AI models to external data sources and tools. Think of it as a universal adapter for AI.
AI Agent
An autonomous AI system that can perceive its environment, make decisions, and take actions to achieve specific goals - without constant human direction.
AG-UI (Agent-User Interaction Protocol)
An open protocol that streams an AI agent's actions, state, and output into the user's frontend in real time.
A2UI (Agent-to-UI Protocol)
Google's open protocol that lets AI agents generate safe, interactive UI components — forms, cards, pickers — from a pre-approved catalog, instead of responding with text.