CopilotKit:面向 Agent 与生成式 UI 的全栈框架,发布 AG-UI 协议
英文标题:📦 CopilotKit/CopilotKit
CopilotKit 是一套用于构建全栈 Agent 应用、生成式 UI 与聊天应用的一流 SDK,现已发展为多平台框架,同一 Agent 可同时驱动 Web、移动端和 Slack。其背后的 AG-UI 协议已被 Google、LangChain、AWS、Microsoft 等采用。该框架支持聊天 UI、后端工具渲染、生成式 UI、共享状态、人机协作及自我学习(CLHF),并提供五钟内快速启动的 CLI 工具。对开发者而言,它提供了从 UI 到 Agent 的完整连接方案,大幅降低了构建 AI 原生应用的复杂度。
25.0 KB
103.4 KB
7.7 MB
48.0 KB
219.3 KB
1.6 KB
1.8 KB
3.9 KB
1.6 KB
1.5 KB
1.5 KB
2.0 KB
7.5 KB
273.6 KB
中文
CopilotKit 是一流的 SDK,用于构建全栈 Agent 应用、生成式 UI 和聊天应用。
它最初只是一个 React 库,如今已发展成为一个多平台 Agent 框架:同一个 Agent 可以为你的 Web 应用、移动应用以及你团队的 Slack 工作区提供动力。
我们是 AG-UI 协议 背后的公司——该协议已被 Google、LangChain、AWS、Microsoft、Mastra、PydanticAI 等采用!
只需五分钟即可启动运行。你只需要一个 LLM 密钥(OpenAI、Anthropic、Gemini 等)。
npx copilotkit@latest create
CopilotKit 提供 Agent 技能,教你的编程 Agent(Claude Code、Codex、Cursor、Gemini 等)如何设置、构建、集成、调试和升级 CopilotKit。
将它们安装到任何项目目录:
npx copilotkit@latest skills install
随时重新运行即可刷新到最新技能。
视频/嵌入内容:Whole.Generative.UI.v5.mp4
1 分钟为你的应用添加 AI
功能:
- 聊天 UI – 一个完全可定制的聊天界面,支持消息流式传输、工具调用和 Agent 响应。
- 后端工具渲染 – 让 Agent 调用后端工具,这些工具返回的 UI 组件会在客户端直接渲染。
- 生成式 UI – 允许 Agent 在运行时根据用户意图和 Agent 状态动态生成并更新 UI 组件。
- 共享状态 – 一个同步的状态层,Agent 和 UI 组件都可以实时读取和写入。
- 人机协同(Human-in-the-Loop) – 让 Agent 暂停执行,请求用户输入、确认或编辑后再继续。
- 自我学习 (早期访问) – Agent 通过上下文强化学习(CLHF)从用户反馈中持续改进。
一个 Agent 后端。覆盖所有前端。
你的 Agent 逻辑保持不变——AG-UI 处理通信协议,CopilotKit 处理每个框架的 UI 层。
💬 超越浏览器:Slack 和 Microsoft Teams(即将推出 Discord、Google Chat……)
你的 Agent 可以在 Web 应用之外运行并生成生成式 UI(了解更多)。
CopilotKit 现在允许你将同一个 Agent 部署到你的用户已经在使用的地方:
- Slack – Agent 作为一流的 Slack 应用:在频道中直接进行话题沟通、工具调用和人机协同审批。
- Microsoft Teams – 将 Agent 工作流带到你的企业组织已经在用的地方。
🔒 早期访问: 我们正在为团队提供接入支持。
👉 申请早期访问 →
通过持续学习改进你的产品。
借助 基于人类反馈的持续学习 (CLHF),作为 CopilotKit 智能平台 的一部分,Agent 在每次交互中都能不断改进:
- 上下文内强化学习 – Agent 无需模型微调即可根据用户交互自动改进。
- 自动提示增强 – Agent 行为会根据最近的交互和结果进行自适应调整。
- 每位用户自适应 – Agent 学习个人偏好,并随着时间为每位用户变得更好。
- 线程与持久化 – 完整的交互历史——生成式 UI、人机协同、共享状态——跨会话被完整捕获。
可通过 CopilotKit Cloud 或自托管获得。
🔒 早期访问: 我们正在为团队提供接入支持。
👉 申请早期访问 →
这将为你带来:
- CopilotKit 已安装 – 核心包已在你应用中完全设置好
- Provider 已配置 – 上下文、状态和钩子已就绪可用
- Agent <> UI 已连接 – Agent 可以流式传输动作并立即渲染 UI
- 可部署 – 你的应用已准备好部署
CopilotKit 将你的 UI、Agent 和工具连接成单一的交互循环。
这使得以下能力成为可能:
- 向用户请求输入的 Agent
- 渲染 UI 的工具
- 跨步骤和会话的有状态工作流
- 一个 Agent,部署到 Web、移动端和聊天平台
useAgent 钩子直接运行在 AG-UI 之上,让你能够以编程方式完全控制 Agent 连接。
// 以编程方式访问和控制你的 Agent
const { agent } = useAgent({ agentId: "my_agent" });
// 渲染并更新你的 Agent 状态
return <div>
<h1>{agent.state.city}</h1>
<button onClick={() => agent.setState({ city: "NYC" })}>
Set City
</button>
</div>
查阅 useAgent 文档 了解更多。
视频/嵌入内容:CopilotKit.UseAgent.Graphic.Motion_2.mp4
生成式 UI 是 CopilotKit 的一项核心模式,允许 Agent 在其工作流中动态渲染 UI。
视频/嵌入内容:demo-generative-ui.mp4 
🖥️ AG-UI:Agent 与用户交互协议
将 Agent 工作流连接到用户侧应用,并在 Agent 技术栈中与 LangChain、CrewAI、Mastra、PydanticAI 等建立深度合作伙伴关系和第一方集成。
npx create-ag-ui-app my-agent-app
🤝 社区
有疑问或需要帮助?
加入我们的 Discord → 阅读文档 → 试用企业智能平台 →
随时了解我们的最新发布!
在 LinkedIn 上关注我们 → 在 X 上关注我们 →
感谢你有兴趣为 CopilotKit 贡献!💜
我们珍视所有贡献,无论是通过代码、文档、创建演示应用,还是仅仅传播消息。
这里有一些有用的资源帮助你入门:
此仓库的源代码基于 MIT 许可证 提供。
English / 原文
CopilotKit is a best-in-class SDK for building full-stack agentic applications, Generative UI, and chat applications.
What started as a React library is now a multi-platform agentic framework : the same agent can power your web app, your mobile app, and your team's Slack workspace.
We are the company behind the AG-UI Protocol - adopted by Google, LangChain, AWS, Microsoft, Mastra, PydanticAI, and more!
Up and running in under five minutes. All you need is an LLM key (OpenAI, Anthropic, Gemini, etc.).
npx copilotkit@latest create
CopilotKit ships agent skills that teach your coding agent (Claude Code, Codex, Cursor, Gemini, and others) how to set up, build with, integrate, debug, and upgrade CopilotKit.
Install them into any project directory:
npx copilotkit@latest skills install
Run it again any time to refresh to the latest skills.
Whole.Generative.UI.v5.mp4
Add AI to your app in 1 minute
Features:
- Chat UI – A fully customizable 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.
- Self-Learning (early access) – Agents that continuously improve from user feedback via in-context reinforcement learning (CLHF).
One agent backend. Every frontend.
Your agent logic stays the same — AG-UI handles the wire protocol, CopilotKit handles the UI layer for each framework.
💬 Beyond the Browser: Slack & Microsoft Teams (Discord, Google Chat coming soon...)
Your agents can run and generate Generative UI beyond the web app (Learn more).
CopilotKit now lets you deploy the same agent to the places your users already work:
- Slack – Agents as first-class Slack apps: threads, tool calls, and human-in-the-loop approvals right in the channel.
- Microsoft Teams – Bring agentic workflows to the enterprise, where your org already lives.
🔒 Early access: We're onboarding teams now.
Improve your product by learning over time.
With Continuous Learning from Human Feedback (CLHF) , part of the CopilotKit Intelligence Platform, agents improve with every interaction:
- In-context reinforcement learning – Agents automatically improve from user interactions, no model fine-tuning required.
- Automatic prompt augmentation – Agent behavior adapts based on recent interactions and outcomes.
- Per-user adaptation – Agents learn individual preferences and get better for each user over time.
- Threads & persistence – Full interaction history — generative UI, human-in-the-loop, shared state — captured across sessions.
Available via CopilotKit Cloud or self-hosted.
🔒 Early access: We're onboarding teams now.
cpk-cli.mp4
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 →
CopilotKit connects your UI, agents, and tools into a single interaction loop.
This enables:
- Agents that ask users for input
- Tools that render UI
- Stateful workflows across steps and sessions
- One agent, deployed across web, mobile, and chat platforms
The useAgent hook sits directly on AG-UI, giving you full programmatic 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.
CopilotKit.UseAgent.Graphic.Motion_2.mp4
Generative UI is a core CopilotKit pattern that allows agents to dynamically render UI as part of their workflow.
Generative UI educational repo →
🖥️ AG-UI: The Agent–User Interaction Protocol
Connect agent workflows to user-facing apps, with deep partnerships and 1st-party integrations across the agentic stack—including LangChain, CrewAI, Mastra, PydanticAI, and more.
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 the Enterprise Intelligence Platform →
Stay up to date with our latest releases!
Follow us on LinkedIn → Follow us on X →
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:
This repository's source code is available under the MIT License.

