Sponsored by Deepsite.site

Open Multi-Agent Canvas

Created By
CopilotKit8 months ago
The open-source multi-agent chat interface that lets you manage multiple agents in one dynamic conversation and add MCP servers for deep research
Content

Open Multi-Agent Canvas

CopilotKit-Banner

multi-agent-canvas

Open Multi-Agent Canvas, created by CopilotKit is an open-source multi-agent chat interface that lets you manage multiple agents in one dynamic conversation. It's built with Next.js, LangGraph, and CopilotKit to help with travel planning, research, and general-purpose tasks through MCP servers.

Existing Agents

Check out these awesome agents (they live in separate repositories). You can run them separately or deploy them on LangSmith:

Additionally, this project now includes a built-in MCP (Multi-Channel Protocol) Agent:

  • MCP Agent: A general-purpose agent capable of handling various tasks through configurable MCP servers.

Copilot Cloud is required to run this project:

Quick Start 🚀

1. Prerequisites

Make sure you have:

2. API Keys

Running the Frontend

Rename the example.env file in the frontend folder to .env:

NEXT_PUBLIC_CPK_PUBLIC_API_KEY=...

Install dependencies:

cd frontend
pnpm i

Need a CopilotKit API key? Get one here.

Then, fire up the Next.js project:

pnpm run build && pnpm run start

MCP Agent Setup

mcp-demo

The MCP Agent allows you to connect to various MCP-compatible servers:

  1. Configuring Custom MCP Servers:

    • Click the "MCP Servers" button in the top right of the interface
    • Add servers via the configuration panel:
      • Standard IO: Run commands locally (e.g., Python scripts)
      • SSE: Connect to external MCP-compatible servers (via Server-Sent Events)
  2. Public MCP Servers:

Running the MCP Agent Backend (Optional)

Rename the example.env file in the agent folder to .env:

OPENAI_API_KEY=...
LANGSMITH_API_KEY=...

If you want to use the included MCP Agent with the built-in math server:

cd agent
poetry install
poetry run langgraph dev --host localhost --port 8123 --no-browser

Running a tunnel

Add another terminal and select Remote Endpoint. Then select Local Development. Once this is done, copy the command into your terminal and change the port to match the LangGraph server 8123 image

Documentation

License

Distributed under the MIT License. See LICENSE for more info.

Recommend Servers
TraeBuild with Free GPT-4.1 & Claude 3.7. Fully MCP-Ready.
Visual Studio Code - Open Source ("Code - OSS")Visual Studio Code
Context7Context7 MCP Server -- Up-to-date code documentation for LLMs and AI code editors
Serper MCP ServerA Serper MCP Server
EdgeOne Pages MCPAn MCP service designed for deploying HTML content to EdgeOne Pages and obtaining an accessible public URL.
TimeA Model Context Protocol server that provides time and timezone conversion capabilities. This server enables LLMs to get current time information and perform timezone conversions using IANA timezone names, with automatic system timezone detection.
Amap Maps高德地图官方 MCP Server
WindsurfThe new purpose-built IDE to harness magic
Jina AI MCP ToolsA Model Context Protocol (MCP) server that integrates with Jina AI Search Foundation APIs.
Tavily Mcp
AiimagemultistyleA Model Context Protocol (MCP) server for image generation and manipulation using fal.ai's Stable Diffusion model.
CursorThe AI Code Editor
Zhipu Web SearchZhipu Web Search MCP Server is a search engine specifically designed for large models. It integrates four search engines, allowing users to flexibly compare and switch between them. Building upon the web crawling and ranking capabilities of traditional search engines, it enhances intent recognition capabilities, returning results more suitable for large model processing (such as webpage titles, URLs, summaries, site names, site icons, etc.). This helps AI applications achieve "dynamic knowledge acquisition" and "precise scenario adaptation" capabilities.
MCP AdvisorMCP Advisor & Installation - Use the right MCP server for your needs
DeepChatYour AI Partner on Desktop
ChatWiseThe second fastest AI chatbot™
Playwright McpPlaywright MCP server
Howtocook Mcp基于Anduin2017 / HowToCook (程序员在家做饭指南)的mcp server,帮你推荐菜谱、规划膳食,解决“今天吃什么“的世纪难题; Based on Anduin2017/HowToCook (Programmer's Guide to Cooking at Home), MCP Server helps you recommend recipes, plan meals, and solve the century old problem of "what to eat today"
MiniMax MCPOfficial MiniMax Model Context Protocol (MCP) server that enables interaction with powerful Text to Speech, image generation and video generation APIs.
BlenderBlenderMCP connects Blender to Claude AI through the Model Context Protocol (MCP), allowing Claude to directly interact with and control Blender. This integration enables prompt assisted 3D modeling, scene creation, and manipulation.
Baidu Map百度地图核心API现已全面兼容MCP协议,是国内首家兼容MCP协议的地图服务商。