Skip to content

Frontend#

A2UIAgent: Rich UI from Your AG2 Agents

Your AG2 agent can reason, call tools, and stream text. But what if it could also generate a full UI — cards, forms, buttons, images — from a single prompt?

A2UIAgent is a new reference agent in AG2 that produces rich, interactive user interfaces using the A2UI protocol. Instead of returning plain text, the agent generates structured JSON that client-side renderers transform into native UI components. The same agent serves web, mobile, and desktop clients — all through standard protocols.

In this post, we'll walk through what A2UIAgent does, how it works under the hood, and how to build a working demo that generates marketing preview cards served over A2A.

Give Your AG2 Agent its own UI with AG-UI

AG2 x AG-UI

You've built an agent with AG2. It reasons, calls tools, and streams responses. But right now it lives in a terminal or a script. The moment you want to put it in front of a user (like for a blog, perhaps) and stream text token by token, show tool activity as it happens, and handle errors gracefully you're building custom plumbing: WebSocket handlers, bespoke JSON formats, state synchronization logic.

AG-UI (Agent-User Interaction Protocol) is an open, lightweight, event-based protocol that standardizes this agent-to-UI layer. AG2 now supports AG-UI natively, meaning you can connect any ConversableAgent to an AG-UI-compatible frontend with just a couple of lines of code.

In this post, we'll look under the hood at how the protocol works by building a working agent chat application from scratch using a ConversableAgent with a weather tool, sending AG-UI events to a browser frontend that renders streaming text and an interactive tool card. Simple HTML, no frontend framework required.

AG2 Agent Chat powered by AG-UI