HeroUIAgents

Overview

Agent UI

Data Visualization Display Information Form Elements Actions

Extend

SoonCustom Components

All Components

Explore the hosted components HeroUI Agent can generate in a response.

Browse the four built-in groups of GenUI components the hosted Agent can emit in a response. Each group includes validated component contracts and meaningful edge states. Because the conversation runs in a cross-origin iframe, arbitrary customer React components and Markdown renderers do not cross into the hosted UI.

Agent UI Groups

Data VisualizationCharts, metrics, tables, comparisons, meters, and dashboards.Display InformationCards, text, media, records, and composed interfaces.Form ElementsForms and compact controls for collecting structured user input.ActionsButtons, follow-up prompts, and action groups.

Product actions and custom components

Connect generated actions to client tools in your website today. Rendering your own React components inside the hosted conversation is coming soon.

Custom Components (Soon)Attach your own UI to client tools. Until then, route hosted actions to browser tools.

How components are selected

A client tool returns structured data from the user's browser.
The hosted Agent selects a compatible component and prepares a typed payload.
The payload is validated against the Agent UI contract.
agent-ui renders the result with the embed's theme and interaction rules.

For direct control over the data available to generated UI, see Client Tools.

Data Visualization

Charts, metrics, tables, comparisons, meters, and dashboards for analytical results.

On this page

Agent UI Groups Product actions and custom components How components are selected