skills.rest
modelcontextprotocolmodelcontextprotocolOfficial·5 Agent Skills Included

ext-apps

Build interactive UIs for MCP tools inside chat clients

Builds interactive charts, forms, and dashboards that render inline inside Claude, ChatGPT, and other MCP-compatible chat clients. Scaffolds new MCP Apps, adds UI to existing MCP servers, converts web apps into hybrid MCP Apps, and migrates OpenAI Apps SDK projects. Eliminates manual protocol wiring, CSP configuration, and iframe communication setup with ready-made templates and step-by-step agent guidance.
2,696|363
↗
npx skills add modelcontextprotocol/ext-apps --all -g -y
Available:

Gives the AI agent the SDK architecture, build commands, and protocol flow it needs to correctly create, migrate, and test MCP Apps using the bundled skills.

All Skills in This Repository (5)

Pure Emerald Level Indicators
📦 In Repo
modelcontextprotocolmodelcontextprotocol

create-mcp-app

Generates a complete MCP App starter with tool, UI resource, and registration metadata.

Official
Advanced
📦 In Repo
modelcontextprotocolmodelcontextprotocol

add-app-to-server

Add interactive MCP Apps UI to existing MCP server tools.

Official
Intermediate
📦 In Repo
modelcontextprotocolmodelcontextprotocol

migrate-oai-app

Migrate OpenAI Apps SDK projects to MCP Apps SDK with API mappings and guidance.

Official
Advanced
📦 In Repo
modelcontextprotocolmodelcontextprotocol

convert-web-app

Add MCP App support to existing web applications with hybrid initialization and resource registration.

Official
Intermediate
📦 In Repo
modelcontextprotocolmodelcontextprotocol

pdf-reading

View and navigate PDF documents via a local server.

Official
Basic

Frequently Asked Questions

FAQPage Schema
How to install MCP Apps skills?▼

Run `npx skills add modelcontextprotocol/ext-apps --all -g -y` in your terminal to install all four skills globally for your AI coding agent.

What is an MCP App?▼

An MCP App pairs an MCP tool with an HTML resource so the tool's result renders as an interactive UI, like a chart or form, directly inside the chat conversation.

How to migrate from the OpenAI Apps SDK to MCP?▼

Ask your agent to migrate your app and the migrate-oai-app skill will map window.openai globals to the App class, update metadata keys, and fix CSP configuration step by step.

Can I add a UI to my existing MCP server?▼

Yes. The add-app-to-server skill analyzes your existing tools, picks which ones benefit from UI, and registers the matching HTML resources without breaking text-only clients.

Which frameworks do MCP Apps support?▼

The suite includes starter templates for React, Vue, Svelte, Preact, Solid, and vanilla JavaScript, all bundled into a single HTML file with Vite.

Related Repositories in Software Engineering

View All in Software Engineering→
openclawopenclaw
388.4k

openclaw

Run a personal AI assistant across your devices and chat apps

Official📦 120 Skills
obraobra
280.0k

superpowers

Gives coding agents a disciplined workflow from idea to merged code

Community📦 15 Skills
facebookfacebook
248.4k

react

AI agent skills for building, testing, and porting React core

Official📦 14 Skills