AI Frameworks · MCP-UI-Org

mcp-ui

mcp-ui is a TypeScript/multi-language SDK that implements the Model Context Protocol (MCP) Apps standard to enable interactive web UIs for AI tools. It provides server-side utilities to create UI resources linked to tools, and client-side components to render them in compatible hosts.

Talk to DEV.co Discuss Implementation

Source: GitHub — github.com/MCP-UI-Org/mcp-ui

GitHub stars

386

Forks

TypeScript

Primary language

Apache-2.0

License (OSI-approved)

Key facts

Objective fields from the source. Values we can't verify are shown as “Unknown” rather than guessed.

Field	Value
Repository	MCP-UI-Org/mcp-ui
Owner	MCP-UI-Org
Primary language	TypeScript
License	Apache-2.0 — OSI-approved
Stars	5k
Forks	386
Open issues	57
Latest release	client/v7.1.1 (2026-05-09)
Last updated	2026-05-09
Source	https://github.com/MCP-UI-Org/mcp-ui

What mcp-ui is

mcp-ui implements the MCP Apps specification using a resource-based pattern where tools link to UI via `_meta.ui.resourceUri`, enabling hosts to fetch and render HTML/interactive content. It offers SDKs for TypeScript (@mcp-ui/server, @mcp-ui/client), Ruby (mcp_ui_server), and Python (mcp-ui-server), with components like AppRenderer for standard hosts and UIResourceRenderer for legacy implementations, plus adapters for platform-specific APIs (e.g., Apps SDK).

Quickstart

Get the mcp-ui source

Clone the repository and explore it locally.

terminalbash

1git clone https://github.com/MCP-UI-Org/mcp-ui.git2cd mcp-ui3# follow the project's README for install & configuration

Need it deployed, integrated, or customized instead? DEV.co ships production installs.

Best use cases

AI Assistant Tool UIs

Building rich, interactive frontends for LLM-based tools that need custom rendering beyond text (charts, forms, interactive widgets).

Multi-Host MCP Tool Distribution

Creating MCP tools once and exposing them across different platforms (ChatGPT Apps SDK, custom MCP hosts, Claude) without per-host rewrites.

Agent Workflow Builders

Implementing visual workflow/automation tools where agents execute tasks and UIs render live feedback, status, or input forms.

Implementation considerations

Multi-language support (TypeScript, Python, Ruby) allows teams to implement tools in their preferred stack, but test cross-language compatibility if mixing SDKs.
MCP Apps pattern uses `_meta.ui.resourceUri` linking; ensure your host correctly implements resource/read to fetch UI payloads; fallback to legacy UIResourceRenderer pattern if needed.
HTML content is rendered in iframes for sandboxing; postMessage protocol handles tool calls and actions, but custom event handling and security policies must be reviewed per host.
Adapters for Apps SDK (e.g., ChatGPT) abstract platform differences; verify adapter behavior with target platforms to avoid surprises.
Tool result passing to UI components requires structured format alignment; document and test data contracts between server tool output and client renderer.

When to avoid it — and what to weigh

Server-Only / Headless-Only Integrations — If your use case requires only text-based or JSON responses with no interactive UI layer, mcp-ui adds unnecessary overhead.
Mature, Stable Production System Requiring Zero Breaking Changes — mcp-ui hit v7.1.1 in May 2026 and is still evolving; breaking changes between minor versions are possible. Conservative orgs may prefer established patterns.
No MCP Host Ecosystem — If your deployment target lacks MCP protocol support or MCP Apps compatibility, the SDK's value is diminished—you'd need to build custom adapters.
Lightweight, Single-Platform Tools — For simple, single-host integrations (e.g., ChatGPT plugin), heavier libraries like mcp-ui may be overkill; direct Apps SDK may suffice.

License & commercial use

Apache License 2.0 (Apache-2.0). This is a permissive OSI-approved license allowing commercial use, modification, and distribution. Attribution required; derivative works and modifications must include a copy of the license.

Apache 2.0 explicitly permits commercial use, modification, and redistribution with attribution. The project is not owned by Anthropic; commercial use is well-supported. No warranty is provided. Verify integration licensing with your MCP host (e.g., Anthropic's terms if targeting ChatGPT) separately.

DEV.co evaluation signals

Editorial assessment — not user reviews. Directional, with an explicit confidence level.

Signal	Assessment
Maintenance	Active
Documentation	Strong
License clarity	Clear
Deployment complexity	Moderate
DEV.co fit	Strong
Assessment confidence	High

Security considerations

HTML content is rendered in sandboxed iframes, isolating scripts. postMessage protocol is used for tool/prompt calls; ensure origin validation and CSRF/XSS hardening in your HTML content. Hosts must validate UI resource URIs before fetching. No explicit security audit data provided; review resource content for injection risks if sourced from untrusted inputs.

Alternatives to consider

Direct Apps SDK Integration (e.g., openai-python for ChatGPT)

If targeting a single platform (ChatGPT), using native SDKs avoids cross-platform abstraction overhead; trade-off is lock-in to one host.

Claude SDK (Anthropic)

If your AI tools are Claude-native, Anthropic's own SDK may offer tighter integration; verify MCP Apps support status before choosing mcp-ui.

LangChain Agents with Custom Tools

For simpler agent workflows without complex UIs, LangChain's tool framework with text/JSON responses may be sufficient and less heavyweight.

Software development agency

Build on mcp-ui with DEV.co software developers

Get started with mcp-ui SDKs for TypeScript, Python, or Ruby. Implement the MCP Apps standard and render rich interfaces across multiple AI platforms.

Talk to DEV.co

Related open-source tools

Surfaced by semantic similarity across the DEV.co open-source index.

mcp-use shadcn-ui-mcp-server mcp

Related on DEV.co

Explore the category and the services that help you build with it.

AI Frameworks AI Application Development Web App Development API Development Talk to DEV.co

mcp-ui FAQ

Do I have to use the MCP Apps pattern, or can I use the legacy UIResource?

Both are supported. MCP Apps (via `_meta.ui.resourceUri`) is recommended and standardized; legacy UIResource/UIResourceRenderer works for older hosts. Use legacy if your host doesn't support `resources/read`.

Can I use mcp-ui with platforms other than ChatGPT or Claude?

Yes. mcp-ui implements the open MCP Apps specification. Any host that understands MCP and can fetch resources is compatible. Adapters exist for platform-specific APIs (Apps SDK); custom adapters may be needed for non-standard hosts.

How does postMessage security work in iframes?

iframes render HTML in a sandboxed context. Tool calls and prompts are sent via postMessage. Origin validation is handled by the host; ensure your HTML content is trusted and doesn't embed untrusted user input.

What if my target host doesn't support MCP Apps or resources/read?

Fall back to the legacy UIResourceRenderer pattern or embed the UI resource payload directly in the tool response. Verify host capabilities before deployment.

Custom software development services

DEV.co helps companies turn open-source tools like mcp-ui into production software. Our software development services cover the full lifecycle — architecture, web development, integration, and maintenance — delivered by software developers and web developers who ship. Engage our software development agency to implement or customize it for your ai frameworks stack.

Ready to Add UI to Your MCP Tools?

Get started with mcp-ui SDKs for TypeScript, Python, or Ruby. Implement the MCP Apps standard and render rich interfaces across multiple AI platforms.

Talk to DEV.co Schedule a Consultation