CopilotKit
Open-source copilot & in-app AI agent framework for React
About CopilotKit
CopilotKit is an open-source framework designed to help frontend developers build and embed contextual AI copilots and autonomous agents directly inside React and Next.js applications. Instead of building isolated chatbot sidebars that have no awareness of your application's state, CopilotKit connects the LLM directly to your frontend components, state stores, and backend APIs. With CopilotKit, applications gain two-way interaction with AI: users can ask questions in natural language, and the AI agent can read current component state, trigger actions across the UI (such as updating tables, filtering views, or submitting forms), and stream live generative UI widgets directly into the workspace. It natively supports popular LLMs, LangChain, and LangGraph multi-agent backends.
CopilotKit architecture consists of frontend React hooks and UI components (`useCopilotAction`, `useCopilotReadable`, `<CopilotSidebar />`) paired with an extensible runtime backend. The frontend hooks serialize active component state into dynamic LLM prompts and register client-side actions that can be triggered deterministically via function calling. The backend runtime acts as an orchestration proxy that can route execution to OpenAI, Anthropic, Ollama, or self-hosted LangGraph agent workflows. It handles streaming responses, structured schema validation, error recovery, and permission boundaries so that user-authorized actions cannot inadvertently alter unintended data. CopilotKit also provides built-in text-editing copilots and auto-suggest inputs for rich document manipulation.
Install the CopilotKit React package and wrap your root layout in CopilotKit provider.
Expose live component state to the copilot using the useCopilotReadable hook.
Define interactive application functions that the AI can execute using useCopilotAction.
Drop in pre-built UI primitives like CopilotSidebar, CopilotPopup, or headless custom chat triggers.
Connect to Copilot Cloud or point to your self-hosted Node.js / Python LangGraph backend runtime.
Capabilities & Features
Common Use Cases
in-app-ai-assistants
agentic-copilots
react-ui-generation
autonomous-form-filling
document-analysis-widgets
embedded-chatbots
Frequently Asked Questions
Is CopilotKit open-source?
Yes, CopilotKit core libraries and UI components are completely open-source under the MIT license and can be self-hosted for free.
How does CopilotKit interact with my React state?
You register state with useCopilotReadable and application actions with useCopilotAction. The AI dynamically understands your app context and invokes validated functions.
Can CopilotKit connect to custom AI models and LangGraph?
Yes, CopilotKit supports custom OpenAI-compatible endpoints, Anthropic Claude, Ollama local models, and multi-agent backends built with LangGraph or CrewAI.
Free Plan
Free open-source community edition with unlimited local components and self-hosted runtimes.
Paid Plan
Copilot Cloud starts at $29/mo with managed backend runtimes, analytics, and enterprise auth.
Direct link · Verified & reader-supported
Pros & Cons
Open-source and fully self-hostable with no vendor lock-in
Two-way UI interaction: agents read live state and render generative UI components
Seamless native integration with LangChain, LangGraph, and OpenAI assistant protocols
Ready-to-use polished React UI components with full Tailwind and CSS customizability
Enterprise-grade security with client-side action authorization checks
Requires React / Next.js ecosystem (Vue and Angular require custom wrappers)
Complex multi-agent orchestrations require backend configuration in LangGraph or Node.js
Alternatives
View allCursor
The AI code editor that knows your whole codebase
An AI-first code editor built on VS Code that understands your entire codebase for smarter completions and chat.
Bolt.new
Prompt, run, and deploy full-stack apps
An AI-powered full-stack web development platform that runs in the browser, allowing users to build and deploy apps with a single prompt.
v0
Generate React UI components from text
An AI system that converts natural language prompts into high-quality React components using Tailwind CSS and Shadcn UI.
Browser Use
Open-source web browsing AI agent for Python & LangChain
Browser Use is an open-source Python library that connects LLMs to browser automation pipelines, enabling AI agents to navigate websites, interact with dynamic DOM elements, bypass multi-step forms, and extract structured data autonomously. Built on top of Playwright and LangChain, it provides vision-augmented element detection and deterministic state tracking. Unlike traditional headless scrapers, Browser Use feeds DOM tree snapshots and viewport screenshots to multimodal models like Claude 3.7 Sonnet or GPT-4o, allowing agents to understand complex UI layouts, handle popups, solve interactive workflows, and execute sequential tasks in plain English.
Anthropic Console
Enterprise-grade AI for developers
The developer gateway to Claude models, offering advanced controls like prompt caching and Artifacts rendering via API.
Open Interpreter
Open-source natural language interface for local computer control and code execution
Open Interpreter is an open-source framework that allows Large Language Models to execute Python, JavaScript, Bash, and AppleScript code locally on your computer. Through a simple terminal interface or desktop GUI, Open Interpreter grants AI models full computer agency to analyze local datasets, control browser windows, edit video files, and automate system tasks with full user permissions. Unlike sandboxed cloud code interpreters, Open Interpreter runs directly on your machine with unrestricted access to your local files, installed packages, and terminal commands.
Compare CopilotKit with Alternatives
Side-by-side feature, pricing, and pros & cons breakdowns