Coding Agents
Use our MCP server to connect your AI agents and backends to CopilotKit.
Overview
The CopilotKit MCP server equips AI coding agents with deep knowledge about CopilotKit's APIs, patterns, and best practices. When connected to your development environment, it enables AI assistants to:
- Provide expert guidance
- Generate accurate code
- Give your AI agents a user interface
- Help you implement CopilotKit features correctly
Cursor
Cursor is an AI-powered code editor built for productivity. It features built-in AI assistance and supports MCP for extending AI capabilities with external tools.
Open MCP Settings in Cursor
- Press
Shift+Command+J(Mac) orShift+Ctrl+J(Windows/Linux) to open Cursor's settings. - Look for "MCP Tools" in the left sidebar categories.
- Click "Add Custom MCP". This will open the mcp.json file in the editor, which you need to edit.
Add MCP Server to Cursor
Copy CopilotKit MCP's configuration and paste it under the mcpServers key in the mcp.json file.
{
"mcpServers": {
"CopilotKit MCP": {
"url": "https://mcp.copilotkit.ai/mcp"
}
}
}
Claude Web
Claude is Anthropic's AI assistant accessible through a web interface. It supports MCP integrations, called Connectors, to connect with external tools and services.
Navigate to the Connectors settings page in Claude.
- Click on your user in the bottom left of the chat box and then select "Settings" from the menu options that appear.
- In the menu along the left side of the Settings page, select "Connectors"
Click "Add custom connector"
- In the Name field, enter a memorable name for the CopilotKit connector, like
CopilotKit - In the URL field, enter the following:
https://mcp.copilotkit.ai/mcp
Click "Add"
Claude Desktop
Claude Desktop is the desktop application version of Claude, offering the same AI capabilities with local system integration and MCP support.
Navigate to the Connectors settings page in Claude. These steps mirror the Claude Web flow — the only difference is that the Connectors link opens inside the Claude desktop app.
- Click on your user in the bottom left of the chat box and then select "Settings" from the menu options that appear.
- In the menu along the left side of the Settings page, select "Connectors"
Click "Add custom connector"
- In the Name field, enter a memorable name for the CopilotKit connector, like
CopilotKit - In the URL field, enter the following:
https://mcp.copilotkit.ai/mcp
Click "Add"
Claude Code
Claude Code is Anthropic's official CLI for Claude. It supports MCP integrations to connect with external tools and services, enhancing AI capabilities with specialized knowledge.
Add MCP Server to Claude Code
Use the Claude Code CLI to add the CopilotKit MCP server:
claude mcp add --transport http copilotkit-mcp https://mcp.copilotkit.ai/mcp
Expected Output:
Added HTTP MCP server copilotkit-mcp with URL: https://mcp.copilotkit.ai/mcp to local config
Verify Connection
Check that the server is properly connected:
claude mcp list
Expected Output:
Checking MCP server health...
copilotkit-mcp: https://mcp.copilotkit.ai/mcp (HTTP) - Connected
Server names can only contain letters, numbers, hyphens, and underscores. Avoid spaces in server names.
Using MCP Tools in Claude Code
Once configured, the CopilotKit MCP server tools are automatically available when you interact with Claude Code for CopilotKit-related development tasks. The AI will intelligently use these tools when relevant to your queries.
What the MCP Server Provides:
- Expert guidance for CopilotKit development
- Accurate code generation for CopilotKit features
- Best practices and implementation patterns
- Deep understanding of CopilotKit APIs
Management Commands:
# View server details
claude mcp get copilotkit-mcp
# Remove server if needed
claude mcp remove copilotkit-mcp -s local
Windsurf
Windsurf is Codeium's agentic IDE that combines AI-powered coding assistance with traditional development tools. It features the Cascade AI assistant with MCP integration.
Access Windsurf MCP Settings
- Open Windsurf Settings (click the settings button in the bottom right)
- Navigate to the "Cascade" section
- Look for "Model Context Protocol" or "MCP" settings
- Enable MCP support if not already enabled
Add MCP Server to Windsurf
You can add CopilotKit MCP via the built-in server browser or by editing the config file directly.
HTTP Transport (recommended):
{
"mcpServers": {
"CopilotKit MCP": {
"url": "https://mcp.copilotkit.ai/mcp",
"disabled": false,
"timeout": 30
}
}
}
stdio Transport (local):
{
"mcpServers": {
"CopilotKit MCP": {
"command": "npx",
"args": ["mcp-remote", "https://mcp.copilotkit.ai/mcp"]
}
}
}
Configuration File Location
The MCP configuration is typically stored at:
- macOS:
~/.codeium/windsurf/mcp_config.json - Windows:
%APPDATA%\.codeium\windsurf\mcp_config.json - Linux:
~/.config/codeium/windsurf/mcp_config.json
Cline
Cline is a VS Code extension that provides autonomous AI coding assistance. It can perform complex tasks using MCP tools to interact with external systems.
Open Cline MCP Settings
- Open the Cline extension panel in VS Code
- Click the menu in the top right corner of the Cline panel
- Select "MCP Servers" from the dropdown menu
Add MCP Server to Cline
In the MCP Servers interface, click "Remote Servers", enter a Server Name (e.g., "CopilotKit MCP"), the URL https://mcp.copilotkit.ai/mcp, then "Add Server".
Alternatively, configure via the settings file:
{
"mcpServers": {
"CopilotKit MCP": {
"url": "https://mcp.copilotkit.ai/mcp",
"disabled": false,
"timeout": 30
}
}
}
GitHub Copilot
GitHub Copilot is Microsoft's AI pair programmer integrated into VS Code and other editors. It supports MCP to extend its capabilities with external tools and services.
Enable MCP Support in VS Code
- Open VS Code Settings (
Cmd+,on Mac orCtrl+,on Windows/Linux) - Search for "MCP" in the settings search bar
- Enable the
chat.mcp.enabledsetting
Add MCP Server to GitHub Copilot
Create a .vscode/mcp.json file in your project root:
{
"servers": {
"CopilotKit MCP": {
"url": "https://mcp.copilotkit.ai/mcp"
}
}
}
Or add to your VS Code settings.json:
{
"mcp": {
"servers": {
"CopilotKit MCP": {
"url": "https://mcp.copilotkit.ai/mcp"
}
}
}
}
Other
For MCP-compatible applications not listed above, use these universal integration patterns. MCP (Model Context Protocol) is an open standard that allows AI applications to connect with external tools and data sources.
HTTP (for web-based or remote integrations):
https://mcp.copilotkit.ai/mcp
stdio (for local command-line integrations):
{
"command": "npx",
"args": ["mcp-remote", "https://mcp.copilotkit.ai/mcp"]
}
Integration Steps
- Find MCP Settings — Look for "MCP," "Model Context Protocol," or "Tools" in your application settings
- Add Server — Use the HTTP URL:
https://mcp.copilotkit.ai/mcp - Test Connection — Restart your application and verify the server appears in available tools