Small details. Big difference.
Make yourself at home.
Try the controls. These preferences are just a preview.
Explore Form Controls →U + AI = Layout UI. The design foundation for you and AI.
Design with AI.
Build like a pro.
Turn your ideas into beautiful websites and apps. A flexible UI framework that gives you and your AI a head start.
Your workspace
Good things in progress.
Projects
3
In progress
1
In review
1
Brand direction
In progress
Website refresh
In review
Component library
Planning
No matching projects. Try another name.
Interactive example · Changes are temporary
3 projects
Your palette. Your personality.
A different point of view.
Explore Themes →Real components. Go ahead, try them.See the Collection →
01 / Beautiful by default
Balanced spacing. Consistent components.
02 / Clear for people and AI
Documented patterns. Real examples.
03 / Yours to shape
Flexible themes. Familiar web code.
Good taste, built into the details.
Real components.
Readable code.
Build with components you can see, code you can read, and patterns your AI can follow. The same foundation supports you from the first idea to the final detail.
The result
A place for your next idea.
Start small. Make it yours.
Get Started
The whole component / HTML
<article class="panel stack">
<span class="badge">Workspace</span>
<h3>A place for your next idea.</h3>
<p>Start small. Make it yours.</p>
<a class="btn btn-gradient" href="/docs">Get Started</a>
</article>
No special syntax. Nothing hidden behind the markup.
A design system for you and your AI.
Your creative direction.
A shared foundation.
Choose how you work. Compose an interface yourself, give AI a starting point, or switch between the two as your ideas take shape.
01 — Describe
Start with your idea.
Decide who you are building for and what they need to do. Explore working examples yourself, or give your AI the guide and component manifest.
02 — Create
Build on good design.
Compose components, blocks, and templates with consistent spacing and clear hierarchy. Choose a theme and make it your own.
03 — Refine
Make every detail count.
Refine the code directly or work through changes with AI. Check mobile layouts, keyboard access, and light and dark states before you ship.
Fits your workflow
Your tools.
One design language.
Bring a consistent design foundation to a new project or an existing application. Start small and adopt the pieces you need.
Start standalone.
Use HTML, CSS, and focused JavaScript for multipage sites or single-page apps. No required framework or build step.
Keep your framework.
Explore Button, Input, Dialog, and Theme examples for React, Next.js, Vue, Nuxt, Angular, Svelte, and Astro.
Make it your own.
Combine semantic components, layout utilities, and theme tokens. Keep your application logic and styling choices in your hands.
Layout UI is in active development. Integration docs explain the tested components and current limits.
Good design starts here.
Your next idea.
Beautifully built.
Bring your ideas to life with beautiful components and a foundation you can make your own. Build hands-on or alongside AI.