Skip to main content

​
Try an example MCP App

​
Connect an example server

Make sure you have installed and logged into Claude Desktop. Navigate to the developer settings page (Settings > Developer) and click the “Edit Config” button. Add one of the example servers to your claude_desktop_config.json:
ExampleDescription
Customer SegmentationData visualization with scatter charts and clustering analysis
MapInteractive 3D globe viewer using CesiumJS
QR CodeQR code generation with customizable colors and styling
ShaderToyReal-time GLSL shader compilation and display
Sheet MusicABC notation rendering with interactive audio playback
⋮Explore more examples—each with ready-to-use config snippets!
{
  "mcpServers": {
    "customer-segmentation": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/customer-segmentation-server", "--stdio"]
    }
  }
}
Save and restart the desktop app to connect.

​
See it in action

Once your local server is connected, prompt Claude to use it. For example, with the customer segmentation server, ask Claude to show you recent customer data. Claude will prompt you for permission to display the App. Click “Always allow”, and you’ll see the MCP App render inline in the conversation.

​
Build your own MCP App

Ready to add an MCP App to your own MCP server? Here are the key resources: If you are using an AI coding agent, MCP Apps skills provide guided development for agents that support the Agent Skills standard, including Claude Code, Cursor, Gemini CLI, and others. In Claude Code, you can install the MCP Apps skills plugin with the following commands: 
/plugin marketplace add modelcontextprotocol/ext-apps
/plugin install mcp-apps@modelcontextprotocol-ext-apps
Once installed, ask your agent to “Create an MCP App” or “Add a UI to my MCP tool”.
You can test remote MCP Apps locally via a proxy like mcp-remote.

​
Migrate from OpenAI Apps SDK

If you are migrating an existing app from the OpenAI Apps SDK to the MCP Apps SDK, see the migration reference. You can also use the MCP Apps skills mentioned above to help migrate your apps. Ask your agent to “Migrate from OpenAI Apps SDK” or “Convert my OpenAI App to an MCP App”.
We’d love to see what you build! Send feedback to [email protected] or open an issue on the ext-apps repository.