copilotkit

CopilotKit Skills for AI Agents

Skills, hooks, MCP configuration, and reference docs that teach AI coding agents how to build with CopilotKit. Covers project setup, feature development, integration wiring, debugging, version migration, and open-source contribution -- all targeting the v2 API surface (@copilotkit/*).

Built on the open Agent Skills standard. One set of SKILL.md files works across Claude Code, Codex, Cursor, and OpenCode.

Table of Contents

• Why This Exists
• Compatibility
• Installation
• Skills
  • copilotkit-setup
  • copilotkit-develop
  • copilotkit-integrations
  • copilotkit-debug
  • copilotkit-upgrade
  • copilotkit-contribute
• Architecture
  • MCP Integration
  • AG-UI Protocol
  • v2 API Surface
• Auto-Approval Hooks
• Automation Pipeline
• Repository Structure
• Contributing
• Support
• License

---

Why This Exists

CopilotKit has a rich API surface spanning React hooks, runtime configuration, agent frameworks, and a streaming protocol. An AI coding agent asked to "add CopilotKit to my app" needs to know which packages to install, which hooks to use, how to wire up the runtime, and how to connect an agent framework -- and it needs to get the v2 APIs right, not the deprecated v1 equivalents.

These skills encode that knowledge. Instead of relying on the agent's training data (which may be stale or incomplete), the skills provide authoritative, maintained guidance that stays current with CopilotKit releases.

---

Compatibility

Feature	Claude Code	Codex	OpenCode	Cursor
Skill prompts (SKILL.md)	Yes	Yes	Yes	Yes
MCP docs integration	Yes	Yes	Yes	Yes
Auto-approval hooks	Yes	--	--	--
Codex agent config	--	Yes	--	--

---

Installation

Recommended: npx skills (all tools)

Works across Claude Code, Codex, Cursor, Gemini CLI, and all tools supporting the agentskills.io standard:

npx skills add copilotkit/skills --full-depth -y

Fresh clones from GitHub every time. To update, run the same command again — it always gets the latest.

Alternative: Claude Code plugin marketplace

/plugin marketplace add CopilotKit/skills
/plugin install copilotkit
/reload-plugins

Note: Claude Code's marketplace update mechanism has known issues with third-party plugins. If updates aren't being picked up, use npx skills add copilotkit/skills --full-depth -y instead.

Alternative: Manual install

Copy skills into ~/.codex/skills/:

git clone https://github.com/CopilotKit/skills.git /tmp/copilotkit-skills
cp -R /tmp/copilotkit-skills/skills/copilotkit-* ~/.codex/skills/

Manual Installation (Any Tool)

Copy each skill directory from skills/ into your tool's skills directory:

Tool	Skills directory
Claude Code	~/.claude/skills/<skill-name>/
Codex	~/.codex/skills/<skill-name>/
OpenCode	~/.config/opencode/skills/<skill-name>/
Cursor	~/.cursor/skills/<skill-name>/

---

Skills

copilotkit-setup

Add CopilotKit to a project from scratch.

• Detects your framework: Next.js App Router, Next.js Pages Router, Remix, or Vite
• Installs @copilotkit/* packages
• Wires up the v2 CopilotRuntime with your LLM provider (OpenAI, Anthropic, Google, etc.)
• Configures the CopilotKitProvider and verifies the integration works end-to-end

Full Documentation

copilotkit-develop

Build AI-powered features using CopilotKit's v2 APIs.

• useAgent -- connect a backend agent to the frontend
• useFrontendTool -- expose UI actions as tools the agent can call
• useComponent -- render agent-driven React components
• CopilotChat -- drop-in chat interface with message views and input handling
• useInterrupt, useHumanInTheLoop, useSuggestions -- control flow and UX primitives
• AgentRunner and BuiltInAgent -- runtime agent orchestration

Full Documentation

copilotkit-integrations

Per-framework integration guides for connecting agent backends to CopilotKit.