Crafted by LumenridgeCrafted by Lumenridge — Frontier AI Design & Engineering Lab
Read the Product Design Harness playbook
You don't need another interface to embed your AI.
You need AI that is ambient.
Versions
Domains & routes
Metrics Last 24 hours
Next steps
Most products add AI by finding a spot for it: a chat tab, a sparkle button, a panel in the corner. Ambient UI rethinks this from Product Design Harness principles. The assistant sits above your product not inside it, and your screens stay yours.
Resting. A small character parked at the edge of the page, doing nothing until you interact with it.
Versions
Domains & routes
Metrics Last 24 hours
Next steps
One box that searches your product and asks the assistant. The familiar ⌘K, rebuilt for an AI-enabled product.
Versions
Domains & routes
Metrics Last 24 hours
Next steps
A conversation that stays open while you work. Answers stack up, so you can look back at what you asked.
Versions
Domains & routes
Metrics Last 24 hours
Next steps
The panel pinned to one side, full height. Your page makes room for it instead of hiding behind it.
Versions
Domains & routes
Metrics Last 24 hours
Next steps
Everything you have asked here. It fills the screen but stays translucent, because the work underneath is why you opened it.
Versions
Domains & routes
Metrics Last 24 hours
Next steps
Why Ambient UI?
Accent, neutrals, radius, density, type, icons and motion — a small config that compiles to CSS variables.
start.md teaches your coding agent the system, so it composes from your vocabulary instead of inventing UI.
Already on assistant-ui, CopilotKit or the Vercel AI SDK? The layer is the presentation; your runtime keeps answering behind it.
Tailwind v4 and v3 variables shadcn components already read, installed as source you own. Radix support and others on the way.
Ships with a design system built on the Product Design Harness playbook by Lumenridge
Your product's core UI and UX decisions live as structured data, open at the /ds route — always there to refer to, or to tweak.
The orb, spotlight, panel, dock and history ship themed by the same config as the rest of your product.
The harness binds your coding agent to the design system, so AI-built screens cannot drift. Approved changes push back to your Figma, keeping both sources of truth in sync.
With the direction held, anyone from a founder to a PM to a junior designer can experiment with polished, production-ready experiences live, before a full engineering cycle.
Get a design-system foundation and an AI interface for your brand.
Try the theme generatorBuilt on shadcn/ui and Tailwind CSS, fully extensible and open source, Ambient UI is installed as source you own. Your coding agent reads the guide, installs the system, and asks you for one design reference. And that's it! Hit ⌘K in your own product and experience it.
One public repo under the MIT license — the components, the Foundation, the registry, and the documents that govern them. Take the whole system, or single pieces through the registry.
MIT · TypeScript · ambientui v0.1.16 on npm · shadcn registry
Every look decision is one configuration. Pick a few values and watch every component follow, the assistant included. Then copy your choices as the one prompt that sets your agent running.
Based on the Product Design Harness playbook
Distilled from 40,000+ hours of product design for SaaS and enterprise at the bleeding edge of AI
Frontier AI Design & Engineering Lab