---
title: "MCP Apps"
icon: "lucide/Monitor"
description: "Render interactive UI components from MCP servers directly in your chat interface."
hideTOC: true
---
import { IntegrationGrid } from "@/components/content/integration-grid";
import { Callout } from "fumadocs-ui/components/callout";

## What is this?

MCP Apps are MCP servers that expose tools with associated UI resources. When the agent calls one of these tools, CopilotKit automatically fetches and renders the UI component in the chat — no additional frontend code required.

<Callout type="info">
  **Free course:** See this pattern built end-to-end in [Build Interactive Agents with Generative UI](https://www.deeplearning.ai/short-courses/build-interactive-agents-with-generative-ui/) — a free DeepLearning.AI short course taught by CopilotKit's CEO covering the full Generative UI spectrum (Controlled, Declarative, and Open-Ended).
</Callout>

Key benefits:
- **Zero frontend code** — UI components are served by the MCP server
- **Full interactivity** — Components can use HTML, CSS, and JavaScript
- **Secure sandboxing** — Content runs in isolated iframes
- **Thread persistence** — MCP Apps are stored in conversation history and restored on reconnect

## Choose your AI backend

<IntegrationGrid path="generative-ui/mcp-apps" />
