Bring your Microsoft Agent Framework agents
into any app
CopilotKit is an open-source framework that connects your app to Microsoft Agent Framework agents. Give your agents chat, generative UI, human-in-the-loop, rich threads, automatic learning and more.
The Microsoft Agent Framework and CopilotKit running together, in the React frontend. Every demo below is the same integration with one capability turned on.
Build with Microsoft Agent Framework
The Microsoft Agent Framework gives you the agent: tools, threads and the host that runs them, in Python or .NET. What it does not give you is the surface. Somewhere for the conversation to happen, a way to show the run while it is running, and a moment for a person to step in. Each capability below builds on something your agent already does.
Generative UI
Your agent calls tools and updates state as it runs. CopilotKit streams both to the browser and renders them as Angular components your users watch update while the agent works.
Read the docs Live demoHuman-in-the-loop
Your agent can pause for a decision, or call a tool that lives in the browser. CopilotKit renders your own UI for either and resumes the run with the user's answer.
Read the docs Live demoShared state
Threads carry state between turns on the server. 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 the Microsoft Agent Framework 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 agent keeps running as its own service, with the AG-UI bridge from agent_framework_ag_ui in front of it. CopilotKit reaches that service over HTTP, so nothing inside the agent 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;