Generative UI
Generative UI is the pattern where a language model dynamically chooses, configures, and renders UI components in real time based on the user's intent — instead of returning text, it returns a UI.
Pioneered by Vercel's AI SDK in 2024 and now broadly adopted, generative UI replaces "chatbot returns text" with "chatbot returns UI components". The model decides whether to show a chart, a form, a card, a map, or a table — and provides the data. The harness renders the components using your design system. This is a major UX shift in chat apps because the model can answer with appropriate interactive surfaces instead of forcing users to read text. Production implementations use function calling or structured output to constrain which components the model can emit.
When to use generative ui
- Chat interfaces that visualise data.
- Conversational dashboards.
- Assistant interfaces for non-text outputs.
Common mistakes
- Letting the model pick any component — too many choices degrade reliability.
- Skipping schema validation on the rendered component args.
FAQ
What is generative ui?
Generative UI is the pattern where a language model dynamically chooses, configures, and renders UI components in real time based on the user's intent — instead of returning text, it returns a UI.
When should I use generative ui?
Chat interfaces that visualise data. Conversational dashboards. Assistant interfaces for non-text outputs.
What are the most common mistakes with generative ui?
Letting the model pick any component — too many choices degrade reliability. Skipping schema validation on the rendered component args.
Related terms
- Function calling (tool use) — Function calling lets a language model emit a structured request to invoke a developer-defined tool, enabling reliable JSON output and agent workflows.
- Structured output — Structured output is any production prompt pattern that forces a language model to return data in a deterministic, machine-parseable form (JSON, XML, custom).
- AI agent — An AI agent is a system where a language model autonomously plans and executes a sequence of tool calls to accomplish a goal.
Last updated: 2026-06-01. Raw markdown: https://promtable.com/glossary/generative-ui.md.