> ## Documentation Index
> Fetch the complete documentation index at: https://docs.praison.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Generative UI

> Agent-driven UI via structured output, AG-UI streaming, and optional A2UI

# Generative UI

PraisonAI supports rich agent output through **three tiers** — use the simplest path that fits your client.

## Tiers

| Tier  | Mechanism                                                       | Best for                                                 |
| ----- | --------------------------------------------------------------- | -------------------------------------------------------- |
| **0** | Markdown streaming (`OutputConfig(stream=True, markdown=True)`) | CLI, logs, simple chat                                   |
| **1** | Structured output (`output_pydantic` / `output_json`)           | APIs — your frontend maps schema → components            |
| **2** | **AG-UI** (`AGUI` + FastAPI)                                    | CopilotKit / React — streaming text + tool events        |
| **3** | **A2UI** (optional `a2ui-agent-sdk`)                            | Cross-platform declarative UI (Flutter, React renderers) |

## Tier 1 — Structured output (recommended)

```python theme={"theme":{"light":"vitesse-light","dark":"vitesse-dark"}}
from pydantic import BaseModel
from praisonaiagents import Agent

class Dashboard(BaseModel):
    title: str
    metrics: list[dict]

agent = Agent(name="analyst", output_pydantic=Dashboard)
data = agent.start("Summarise Q1 sales")
# Map Dashboard schema to your React/Vue components
```

## Tier 2 — AG-UI (CopilotKit)

```python theme={"theme":{"light":"vitesse-light","dark":"vitesse-dark"}}
from praisonaiagents import Agent, AGUI
from fastapi import FastAPI

agent = Agent(name="assistant", tools=[search])
agui = AGUI(agent=agent)

app = FastAPI()
app.include_router(agui.get_router())
```

Deploy: `praisonai serve a2u --port 8002`

AG-UI streams text deltas and tool call events to compatible frontends. See [AG-UI server](/docs/deploy/servers/agui). A2UI tool results also emit a `CUSTOM` event `name="a2ui"` on the AG-UI stream.

## Tier 3 — A2UI (optional)

For declarative JSON UI consumed by [A2UI renderers](https://github.com/google/A2UI):

```bash theme={"theme":{"light":"vitesse-light","dark":"vitesse-dark"}}
pip install praisonaiagents[a2ui]
```

See [A2UI Protocol](/docs/features/a2ui) for details.

For **any custom frontend**, see [Integrate A2UI with Your Frontend](/docs/features/integrate-a2ui-frontend).

## What not to use

* Do not reimplement A2UI types in application code — use the official SDK via `praisonaiagents[a2ui]`.
* Renderers live outside PraisonAI core (React, Flutter, Lit in the Google A2UI repo).
