AI-Native UI
Also called: Conversational UI, Chat-first UI, GenAI interface
The prompt bar is the hero: a calm white canvas, a glowing composer, streaming answers, sparkle accents and agent cards.
Design keywords
Say these words to ask for this style.
AI-Native UI is built around a conversation instead of pages of menus. The main object is a large, rounded composer with a soft blue-violet-pink glow behind it; answers stream in with a blinking caret and rich inline blocks (numbers, charts, sources); work is delegated to “agent” cards that show status and progress. Everything else is quiet and roomy — warm white surfaces, generous radius, light weights — with a single sparkle gradient (✦) reserved for AI moments so users always know where the model is speaking.
Best for
- AI assistants, copilots and agent platforms
- Search and knowledge tools
- Support and customer-service products
- Any product adding a “just ask” entry point
Avoid for
- Data-entry-heavy back offices where forms are faster
- Brands that must feel loud, retro or decorative
- Products with no real language model behind them (it over-promises)
✓ Do
- Make the composer the largest interactive element (64–68px tall, 28px radius)
- Reserve the blue→violet→pink gradient for AI-generated moments only
- Stream answers with a 2px blinking caret and show tool/agent steps as small chips
- Offer 3–4 suggestion chips so the empty state is never blank
✕ Don't
- Don’t bury the prompt bar in a sidebar or modal
- Don’t paint whole pages with the gradient — it is an accent, not a background
- Don’t use robot mascots or circuit-board clichés
- Don’t fake certainty: show sources and a “can make mistakes” note
Not to be confused with
On mobile
Home is the conversation: big greeting, suggestion cards and a composer docked above the keyboard instead of a tab bar. Keep the glow to one static blurred layer behind the composer, and stream text without animating layout.
Prompt builder
Paste into Claude, Cursor, v0, Lovable or any coding agent to recreate this style.