Comparisons
MCP Apps builders and frameworks compared (2026)
There is no single MCP app builder. There are frameworks, agent skills, inspectors, component libraries and one visual builder, and each is best at something different.
9 min read
#The short answer
If you want an MCP app builder or a ChatGPT app builder in 2026, pick by what you want to write. To write code, use the official @modelcontextprotocol/ext-apps SDK or a framework on top of it (mcp-use, Skybridge, sunpeak, FastMCP for Python). To have an AI agent write it, use an agent skill (the official ext-apps skills, Anthropic's build-mcp-app, Microsoft's generate-mcp-app-ui). To test what you built, use an inspector such as MCPJam. To skip the code for the view entirely, a visual builder such as Widgetry gives you templates, designs and a real host preview. All of them target the MCP Apps standard, so ChatGPT, Claude, VS Code and the other MCP Apps hosts can render the result.
This page compares them as of October 2026, fairly: each section says what the tool is genuinely best at.
#The comparison table
| Tool | Kind | Language | What you write | Hosting | Best for |
|---|---|---|---|---|---|
| ext-apps SDK | Official SDK | TypeScript (views in any web stack) | Server registration and an HTML view | Your server | Full control, closest to the spec |
| ext-apps agent skills | Agent skills | TypeScript | A prompt; the agent writes the code | Your server | Scaffolding, migrating an OpenAI app |
| build-mcp-app | Agent skill (Anthropic) | Agent-written code | A prompt | Your server | Forms, pickers and confirm dialogs in Claude |
| mcp-use | Framework | TypeScript and Python | React components in resources/ | Self-host or Manufact Cloud | Full apps with an inspector built in |
| Skybridge | Framework | TypeScript, React | React views and typed server code | Self-host (Node.js) or Alpic | Type-safe full-stack apps |
| sunpeak | Framework and testing tool | TypeScript, React | React views, simulations | Your server | Testing against ChatGPT and Claude simulators |
| Flowbite MCP UI components | Component library | TypeScript, React, Tailwind | Your app, with ready components | Your server | Ready-made inputs, charts, tables |
| MCPJam Inspector | Inspector | Any | Nothing (it runs your server) | Local | Previewing and debugging without a subscription |
| Vercel mcp-handler | Starter template | TypeScript, Next.js | A Next.js app | Vercel | Teams already on Next.js and Vercel |
| FastMCP | Framework | Python | Prefab components or inline HTML | Your server | Python servers |
| generate-mcp-app-ui | Agent skill (Microsoft, preview) | HTML with Fluent UI | A prompt plus your tool's JSON | Power Apps tools, other hosts | Fluent UI widgets for Microsoft 365 Copilot |
| Widgetry | Visual builder | None to start (Liquid, CSS if you want) | Data and a design; markup optional | Linked from your server, downloaded, or Widgetry's endpoint | Polished widgets without a build, authored by people or agents |
#The official ext-apps SDK and its agent skills
@modelcontextprotocol/ext-apps is the reference implementation of the spec. On the server, registerAppTool and registerAppResource from /server register the tool and its ui:// resource. In the view, the App class (or useApp from /react) handles the handshake, tool input, results and calls back to the server. There are starter templates for React, Vue, Svelte, Preact, Solid and vanilla JS, and examples that go as far as CesiumJS maps, three.js scenes and PDF viewers.
Best at: control. Nothing sits between you and the protocol, and when the spec changes this is where it lands first. Note the version split: 2.x (from 8 September 2026) needs the split MCP SDK v2 packages, while Claude's quickstart still pins ext-apps@^1. The wire protocol is the same in both. The walkthrough is in build an MCP App in TypeScript.
The same repo ships four agent skills: create-mcp-app (scaffold from scratch), migrate-oai-app (convert an OpenAI app), add-app-to-server (add UI to an existing server's tools) and convert-web-app (turn a web app into a hybrid web and MCP App). In Claude Code you install them as the mcp-apps plugin:
/plugin marketplace add modelcontextprotocol/ext-apps
/plugin install mcp-apps@modelcontextprotocol-ext-appsBest at: getting the boilerplate right on the first try, and migrating an existing window.openai app.
#Anthropic's build-mcp-app skill
build-mcp-app is one of three skills in Anthropic's mcp-server-dev plugin, next to build-mcp-server (the entry point that picks a deployment model and a tool design) and build-mcpb (packaging a local server with its runtime). It adds interactive widgets such as forms, pickers and confirm dialogs, rendered inline in chat, to remote servers and MCPB bundles.
Best at: the whole server, not only the view. If you are also deciding how to deploy and how to shape your tools, start here.
#mcp-use (Manufact)
mcp-use is an MIT-licensed framework with the same server API in TypeScript and Python. You drop React components in resources/ and they register themselves as widgets; a useWidget hook gives them props, theming and state. It includes a browser inspector at /inspector to test tools and watch the JSON-RPC traffic, and it supports both the Apps SDK and MCP Apps. You can self-host or deploy to Manufact Cloud.
Best at: teams that want a batteries-included framework, in either language, with a short path from a React component to a widget.
#Skybridge (Alpic)
Skybridge calls itself "the full-stack React framework for MCP Apps and MCP Servers". It is TypeScript end to end, with types inferred from server to view, React Query-style hooks, and a dev server with a local emulator, hot reload and a permanent tunnel to Claude and ChatGPT. MIT licensed; host it on any Node.js platform or on Alpic.
Best at: type safety across the server and the view, and a fast local loop.
#sunpeak
sunpeak is an MIT framework and testing tool. Tools, resources and simulations are discovered from the file system, and its local inspector replicates the ChatGPT and Claude runtimes. Simulation fixtures let you test across hosts, themes and data in CI, with Playwright end-to-end tests and live tests against ChatGPT.
Best at: testing. If you need to know a widget behaves in both hosts before you ship, this is the most testing-focused option on this list.
#Flowbite MCP UI components
MCP UI components by Themesberg is an MIT library built on Flowbite, Skybridge, React and Tailwind. It ships text, radio group, checkbox, line chart, product, QR code and table widgets.
Best at: not designing basic inputs and charts yourself when you already work in React and Tailwind.
#MCPJam Inspector
MCPJam Inspector includes an App Builder that emulates both ChatGPT apps and MCP Apps locally. You run your tools, see the widget next to the logs (including JSON-RPC traffic), and resize it for desktop, tablet and mobile. It starts with npx @mcpjam/inspector@latest.
Best at: previewing and debugging any server, whatever you built it with, without a public URL or a ChatGPT subscription. It complements every other tool here.
#Vercel and mcp-handler
On 4 March 2026 Vercel announced MCP Apps support, with a Next.js starter built on mcp-handler. You get server-side rendering and React Server Components for the view and deploy on Vercel.
Best at: teams already running Next.js on Vercel.
#FastMCP (Python)
FastMCP adds apps support with pip install "fastmcp[apps]". UIs are built from Prefab components (charts, data tables, forms), with inline HTML when you need to go beyond them, and fastmcp dev apps previews them in the browser. Examples include a sales dashboard, a system monitor, a map and a generative UI provider.
Best at: Python servers. Most of the other options are TypeScript first.
#Microsoft Power Apps generate-mcp-app-ui
generate-mcp-app-ui is a preview skill for Claude Code or GitHub Copilot CLI. You describe the widget and paste your tool's real JSON output; it writes one self-contained HTML file with Fluent UI web components and design tokens for light and dark themes, and can wire app.callServerTool for a refresh button. It does not register or deploy the server for you.
Best at: Fluent UI widgets for Power Apps tools and Microsoft 365 Copilot, generated from real data.
#Where Widgetry is different
Every tool above is a code framework, an AI skill or an inspector. Widgetry is a visual builder:
- Templates times designs. Thirteen widget types (board, KPIs, bar, area and donut charts, table, countdown, milestones, a 3D globe and more, see the templates) and twenty built-in designs, fourteen of them inspired by well-known brands, plus a designer for your own. Any type wears any design.
- A preview that is a real host. The editor speaks the same MCP Apps protocol as the chats, in light and dark, and applies the same CSP to images, so what you see is what the chat shows.
- No build. A widget is a Liquid template, CSS, an optional script (with three.js, GSAP, d3 or Chart.js from a pinned catalog) and the JSON Schema of its data. The markup, styles, script and schema are editable, but you do not have to touch them to start.
- Linked from your server. Your MCP server reads the published widget from its live URL with a read-only API key, kept for a minute, so what you publish reaches the server without a deploy. Or download the HTML document and its manifest and register them with the official TypeScript SDK. Or connect Widgetry's own
/mcpendpoint to your agent if you have no server yet. The steps are in add a UI to your MCP server. - Agents author through MCP. The same
/mcpendpoint gives an agent fifteenwidgetry_*tools: eight to read (organization, templates, widgets, export, designs) and, with write access through OAuth or a write key, seven to create, edit, publish and delete widgets and designs. See create widgets with your AI agent.
#When Widgetry is not the right choice
- Complex custom apps with heavy client logic. Multi-step flows, local state across screens or your own component tree belong in a framework (Skybridge, mcp-use, sunpeak) or the bare SDK. A Widgetry widget renders the data the model sends it and never fetches data on its own; its interactions are posting a message, opening a link or calling a tool.
- ChatGPT-only capabilities. Checkout, modals, file upload and widget state live on
window.openai, which Widgetry does not use. Its widgets stick to the shared MCP Apps standard. - Everything in your own repo from the start. You can download the files and stop depending on Widgetry, but the authoring happens in Widgetry's editor or through its MCP tools, not in your codebase. And the export snippet is TypeScript only for now.
#How to choose
- You want full control and know TypeScript: the ext-apps SDK, or Skybridge if you want types end to end.
- You want a framework with hosting and an inspector: mcp-use or Skybridge.
- You must test across ChatGPT and Claude in CI: sunpeak.
- Your server is in Python: FastMCP or mcp-use.
- You live on Next.js and Vercel: the
mcp-handlerstarter. - You want your agent to write the code: the ext-apps skills or Anthropic's
build-mcp-app; Microsoft's skill if your target is Copilot. - You want to see what you have built, whatever it is: MCPJam Inspector.
- You want a polished widget in minutes, without a build, that your server links to and your agent can edit: Widgetry.
They also combine. What Widgetry exports is a standard MCP Apps resource and tool definition, so an inspector such as MCPJam previews it like anything else, and a server built with another tool can serve it next to its own views. For how these tools relate to the older formats, read MCP Apps vs MCP-UI vs OpenAI Apps SDK.