assistant-ui logo/
MCP Apps

Build MCP apps once, run them anywhere

MCP apps let you put real UI inside AI conversations — not just text, but things people can actually interact with. Build and preview locally with hot reload, then export once for any host.

Try the workbench

Preview your app in real time, mock tool calls, and export a production-ready bundle — all from your browser.

mcp-app-studio-starter.vercel.app

Best on desktop

Open this page on a desktop browser to try the interactive demo.

Everything you need to ship MCP apps

Build it, preview it, export it. One toolchain for whatever you're shipping.

Live Preview

Hot reload across every screen size — desktop, tablet, and mobile.

Mock Tool Responses

Stub out tool calls with JSON responses. Test success paths, errors, and edge cases — no backend needed.

MCP Server Scaffold

Includes an MCP server template. Run frontend and tools with a single command.

Production Export

Export a deployable widget bundle with one command. Use `--inline` for a single-file build.

Display Modes

Preview inline, picture-in-picture, and fullscreen — exactly as it appears in Claude or ChatGPT.

Universal SDK

One API surface for MCP hosts and ChatGPT extensions, with capabilities detected at runtime.

Know what works where

Your app runs inside the host's conversation window. Different hosts support different things — detect what's available and adapt.

Capability
ChatGPT ext.
MCP host
App state
Save and restore app state through ChatGPT's widget state APIs.
Model context
Read and write model context via MCP on hosts that support it.
Host modal
Open native modals in ChatGPT when available; falls back to local modals elsewhere.
Tool mocking
Mock tool responses locally while you build.

Export and ship

Ship one bundle that works in Claude, ChatGPT, or any MCP-compatible client.

export/

Deploy export/widget/ to any static host, then point export/manifest.json at the hosted URL and register with your target host. The same bundle runs on MCP hosts like Claude and as a ChatGPT extension. Export emits index.html, widget.js, and widget.css by default — add --inline for single-file HTML. The host decides which capabilities your app can use.