Bring your AG2 agents
into any app
CopilotKit is an open-source framework that connects your app to AG2 agents. Give your agents chat, generative UI, human-in-the-loop, rich threads, automatic learning and more.
AG2 and CopilotKit running together, in the React frontend. Every demo below is the same integration with one capability turned on.
Build with AG2
AG2 gives you the conversation between your agents: roles, turns and the tools they call. What it does not give you is the surface a person joins it through. Each capability below builds on something your agents already do.
Generative UI
Your agents call tools as the conversation runs. CopilotKit streams those calls to the browser and renders each one as a an Angular component, instead of leaving the user with a spinner.
Read the docs Live demoHuman-in-the-loop
A frontend tool registered with useHumanInTheLoop renders your own UI, waits for the user's answer, and hands it back to the agent as the tool result.
Read the docs Live demoShared state
Your agents carry state across turns. CopilotKit mirrors it into your app and back, so a user edit and an agent write land in the same place.
Read the docs Live demoChat surfaces, headless UI, frontend tools and multi-agent flows work with AG2 too. And more
Start building
Connect an existing agent or build a new one. Get a tailored setup prompt.
Where are you starting?
Tell us what you already have. We’ll tailor your setup.
Connect your agent
Your agents keep running as their own Python service, with AGUIStream from autogen.ag_ui in front of them. CopilotKit reaches that service over HTTP, so nothing inside AG2 changes.
import {
CopilotRuntime,
createCopilotRuntimeHandler,
} from "@copilotkit/runtime/v2";
import { HttpAgent } from "@ag-ui/client";
const runtime = new CopilotRuntime({
agents: {
my_agent: new HttpAgent({ url: process.env.AGENT_URL! }),
},
});
const handler = createCopilotRuntimeHandler({
runtime,
basePath: "/api/copilotkit",
});
export const GET = handler;
export const POST = handler;