Concepts Components Blog Roadmap
Get Started
On this page

A2UI Concepts Overview

High-level architectural overview of the Agent to User Interface protocol.

A2UI Concepts Overview

The Big Picture

A2UI is built around three core ideas:

  1. Streaming Messages: UI updates flow as a sequence of JSON messages from agent to client.
  2. Declarative Components: UIs are described as data, not programmed as code.
  3. Data Binding: UI structure is separate from application state, enabling reactive updates.

Key Topics

Data Flow

How messages travel from agents to rendered UI. Includes a complete lifecycle example of a restaurant booking flow, transport options (SSE, WebSockets, A2A), progressive rendering, and error handling.

Component Structure

A2UI’s adjacency list model for representing component hierarchies. Learn why flat lists are better than nested trees for Generative UI, how to use static vs. dynamic children, and best practices for incremental updates.

Data Binding

How components connect to application state using JSON Pointer paths. Covers reactive components, dynamic lists, input bindings, and the separation of structure from state that makes A2UI powerful.

Message Types

A2UI uses four message types:

  • surfaceUpdate: Define or update UI components
  • dataModelUpdate: Update application state
  • beginRendering: Signal the client to render
  • deleteSurface: Remove a UI surface

For complete technical details, see the Message Reference.


Ready to Build?

Now that you understand the concepts, dive into practical implementation:

Your GoalRecommended Guide
Quick StartGetting Started in 5 Minutes
Build a Real AgentFlight Search Tutorial
Customize ComponentsCustom Components Guide
Integrate with CopilotKitCopilotKit Integration