mcp-mcp-apps-kit

Official

Guide to building MCP Apps UI extensions.

AuthorAndurilCode
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill provides comprehensive guidance for implementing MCP Apps (SEP-1865) — an extension to MCP that enables servers to deliver interactive HTML-based UIs alongside tool results in host environments like Claude Desktop or ChatGPT.

Core Features & Use Cases

  • Guidance on defining UI resources with ui:// URIs, linking tools to UI via _meta.ui, and implementing bidirectional JSON-RPC messaging.
  • Lifecycle, security, and host-context integration patterns for common MCP Apps scenarios (dashboards, forms, visualizations).
  • Real-world use cases and best practices for building interactive MCP Apps that work across hosts.

Quick Start

Use the mcp-apps-builder skill to scaffold a new MCP App:

  • Run: npx @mcp-apps-kit/create-app@latest my-app
  • Change directory: cd my-app
  • Start development: npm run dev
  • Or manually set up a file-based project:
  • npm install @mcp-apps-kit/core @mcp-apps-kit/codegen zod

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: mcp-mcp-apps-kit
Download link: https://github.com/AndurilCode/mcp-apps-kit/archive/main.zip#mcp-mcp-apps-kit

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.