Bring your LlamaIndex agents
into any app
CopilotKit is an open-source framework that connects your app to LlamaIndex agents. Give your agents chat, generative UI, human-in-the-loop, rich threads, automatic learning and more.
LlamaIndex and CopilotKit running together, in the React frontend. Every demo below is the same integration with one capability turned on.
Build with LlamaIndex
LlamaIndex gives you the agent and everything it reads: indexes, retrievers and the workflow around them. 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 workflow emits events and tool calls as it runs. CopilotKit streams them to the browser and renders each one as a an Angular component, so retrieval and reasoning are visible instead of hidden behind 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 workflow carries state between steps. 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 LlamaIndex 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 LlamaIndex service. The LlamaIndexAgent bridge points CopilotKit at its AG-UI endpoint, so nothing inside the agent changes.
import {
CopilotRuntime,
createCopilotRuntimeHandler,
} from "@copilotkit/runtime/v2";
import { LlamaIndexAgent } from "@ag-ui/llamaindex";
const runtime = new CopilotRuntime({
agents: {
my_agent: new LlamaIndexAgent({ url: "http://localhost:8000/run" }),
},
});
const handler = createCopilotRuntimeHandler({
runtime,
basePath: "/api/copilotkit",
});
export const GET = handler;
export const POST = handler;