How Can I Use A2UI?
How Can I Use A2UI?
Section titled “How Can I Use A2UI?”Choose the integration path that matches your role and use case.
Three Paths
Section titled “Three Paths”Path 1: Building a Host Application (Frontend)
Section titled “Path 1: Building a Host Application (Frontend)”Integrate A2UI rendering into your existing app or build a new agent-powered frontend.
Choose a renderer:
- Web: Lit, Angular, React
- Mobile/Desktop: Flutter GenUI SDK
Quick setup:
For Angular:
npm install @a2ui/angular @a2ui/web-libFor React:
npm install @a2ui/react @a2ui/web-libConnect to agent messages (SSE, WebSockets, or A2A) and customize styling to match your brand.
Next: Client Setup Guide | Theming
Path 2: Building an Agent (Backend)
Section titled “Path 2: Building an Agent (Backend)”Create an agent that generates A2UI responses for any compatible client.
Choose your framework:
- Python: Google ADK, LangChain, custom
- Node.js: A2A SDK, Vercel AI SDK, custom
Include the A2UI schema in your LLM prompts, generate JSONL messages, and stream to clients over SSE, WebSockets, or A2A.
Next: Agent Development Guide
Path 3: Using an Existing Framework
Section titled “Path 3: Using an Existing Framework”Use A2UI through frameworks with built-in support:
- AG UI / CopilotKit - Full-stack React framework with A2UI rendering
- Flutter GenUI SDK - Cross-platform generative UI (uses A2UI internally)