CopilotKit

CopilotKit

The Frontend for Agents & Generative UI. React + Angular

Stars: 28829

Visit
 screenshot

CopilotKit is an open-source framework for building, deploying, and operating fully custom AI Copilots, including in-app AI chatbots, AI agents, and AI Textareas. It provides a set of components and entry points that allow developers to easily integrate AI capabilities into their applications. CopilotKit is designed to be flexible and extensible, so developers can tailor it to their specific needs. It supports a variety of use cases, including providing app-aware AI chatbots that can interact with the application state and take action, drop-in replacements for textareas with AI-assisted text generation, and in-app agents that can access real-time application context and take action within the application.

README:

FavIcon

CopilotKit

Docs · Examples · Copilot Cloud · Discord

Build agent-native applications with generative UI, shared state, and human-in-the-loop workflows.

CopilotKit

NPM MIT Discord

CopilotKit%2FCopilotKit | Trendshift

What is CopilotKit

CopilotKit is a best-in-class SDK for building full-stack agentic applications, Generative UI, and chat applications.

We are the company behind the AG-UI Protocol, adopted by Google, LangChain, AWS, Microsoft, Mastra, PydanticAI, and more!

https://github.com/user-attachments/assets/de5bcc17-1b51-4092-9a85-42971ecc1f4c

Features:

  • Chat UI – A React-based chat interface that supports message streaming, tool calls, and agent responses.
  • Backend Tool Rendering – Enables agents to call backend tools that return UI components rendered directly in the client.
  • Generative UI – Allows agents to generate and update UI components dynamically at runtime based on user intent and agent state.
  • Shared State – A synchronized state layer that both agents and UI components can read from and write to in real time.
  • Human-in-the-Loop – Lets agents pause execution to request user input, confirmation, or edits before continuing.

https://github.com/user-attachments/assets/55bf6714-62a7-4d5d-9232-07747cc0763b

Quick Start

New projects:

npx copilotkit@latest create -f <framework>

Existing projects:

npx copilotkit@latest init

https://github.com/user-attachments/assets/7372b27b-8def-40fb-a11d-1f6585f556ad

What this gives you:

  • CopilotKit installed – Core packages are fully set up in your app
  • Provider configured – Context, state, and hooks ready to use
  • Agent <> UI connected – Agents can stream actions and render UI immediately
  • Deployment-ready – Your app is ready to deploy

Complete getting started guide →

How it works:

CopilotKit connects your UI, agents, and tools into a single interaction loop.

CopilotKit Diagram — Motion x2 6 sec version

This enables:

  • Agents that ask users for input
  • Tools that render UI
  • Stateful workflows across steps and sessions

⭐️ useAgent Hook

The useAgent hook is a proper superset of useCoAgent and sits directly on AG-UI, giving more control over the agent connection.

// Programmatically access and control your agents
const { agent } = useAgent({ agentId: "my_agent" });

// Render and update your agent's state
return <div>
  <h1>{agent.state.city}</h1>
  <button onClick={() => agent.setState({ city: "NYC" })}>
    Set City
  </button>
</div>

Check out the useAgent docs to learn more.

https://github.com/user-attachments/assets/67928406-8abc-49a1-a851-98018b52174f

Generative UI

Generative UI is a core CopilotKit pattern that allows agents to dynamically render UI as part of their workflow.

https://github.com/user-attachments/assets/3cfacac0-4ffd-457a-96f9-d7951e4ab7b6

Compare the Three Types

image

Explore:

Generative UI educational repo →

🖥️ AG-UI: The Agent–User Interaction Protocol

Connect agent workflow to user-facing apps, with deep partnerships and 1st-party integrations across the agentic stack—including LangGraph, CrewAI, and more.

AG-UI


npx create-ag-ui-app my-agent-app
Learn more in the AG-UI README →

🤝 Community

Have questions or need help?

Join our Discord → Read the Docs → Try Copilot Cloud →

Stay up to date with our latest releases!

Follow us on LinkedIn → Follow us on X →

🙋🏽‍♂️ Contributing

Thanks for your interest in contributing to CopilotKit! 💜

We value all contributions, whether it's through code, documentation, creating demo apps, or just spreading the word.

Here are a few useful resources to help you get started:

📄 License

This repository's source code is available under the MIT License.

For Tasks:

Click tags to check more tools for each tasks

For Jobs:

Alternative AI tools for CopilotKit

Similar Open Source Tools

For similar tasks

For similar jobs