It should look like
your product.
Colors and shape live in one stylesheet as variables. Change them and every screen follows: the product, the login screen, and the admin panel, in light and dark.
--primary: oklch(0.65 0.22 50);the admin panel reads the same names
One codebase. Five different companies.
Real covers from the five shipped templates. A theme, a radius, a mode: that is the entire difference.
Pick a theme. Watch every corner change.
The same presets the CLI writes into a generated project, applied live.
13
light / dark in every oneFull themes, each in light and dark
The same presets the CLI writes into a generated project.
1 file
styles.css
app
login
admin
To retheme every screen you own
App, login and admin all follow assets/styles.css.
5
five brands, one codebase
Brands already running on this system
The shipped templates differ by tokens, not by code.
The admin panel too. And both modes.
Most template theming stops at the marketing site. This reaches the product, the admin panel, and the login screen.
:root
primary
secondary
muted
card
destructive
accent
.dark
primary
secondary
muted
card
destructive
accent
Retheme without hunting hex codes
Semantic names, both modes from one set of variables, internal tools included.
Ask for primary, not orange-500
Components ask for the role, never for the color.
primary
secondary
muted
card
destructive
accent
Same names, different values
Two value sets under the same variables. Not two designs.
:root
Light values
.dark
Dark values
Internal tools match the product
Same stylesheet. One retheme covers both.
Five skins, one codebase
A theme, a radius, a starting mode. That is the difference.
- Vaultblack0.375remdark
- Aetherdefault0.4remdark
- Better Studioocean1remdark
- Open Calendarlime1remlight
- Mind Mappaper1remlight
Every piece follows the same tokens.
Components, layouts, and themes, all driven by the one stylesheet you just tried in the switcher.
Dark mode and theming
One Tailwind token file drives every color. Rebrand the whole app or ship dark mode before lunch.
13 ready-made themes
Every preset ships in light and dark, and the CLI writes your pick into the project. Change your mind by editing one file.
Five brand templates
Five finished brands run on the same token system. Start from the closest one instead of theming from scratch.
Landing pages included
Every template ships a finished marketing page: hero, features, pricing, footer. It reads the same tokens as the app, so one retheme covers both.
Layouts
App shells with sidebar nav, org switcher, and breadcrumbs. Rebrand the whole UI from one token file, swap layouts without touching your pages.
Mobile-ready navigation
Sidebars fold into a drawer on small screens. Every layout ships responsive, so phones work on day one.
See it running
Templates are curated project starters built on this stack: a layout, feature packs, a custom theme, and bonus pages. The previews below are recordings of the real apps.
Questions, answered
Make it look like your product.
Start from the closest template, or take the neutral starter and write your own values into one file.
13 presets / both modes / your repo