BrandOS — The brand contract generator

EN
OverviewTokensComponentsTypographyDownload

Now viewing BrandOS · powered by UI8Kit + brandos.brand.css

brandosui8kitrestaauthfly
Live tweaks

Cycle presets and token axes on top of the active brand. Refresh resets to brand defaults.

Preset

Radius

Density

Depth

Motion

Generator · Design system

BrandOS

Strict monochrome chrome, vibrant product gradients. Variable Noto Sans, pill geometry, dashed focus — the design tool that designed itself.

CLIAgentDESIGN.mdOpen Source
Explore tokens Repository AGENTS.md
Sections

Three pillars of every brand

Foundations, component surfaces and type voice stay connected through the same token contract.

01 · Tokens

Foundations

Semantic color, type, radius, shadow, motion and surfaces.

Open ->
02 · Components

UI Kit

Buttons, cards, forms and feedback examples rendered by UI8Kit.

Open ->
03 · Typography

Voice

Specimen, scale, prose and technical text for the brand.

Open ->
04 · Download

CSS export

Copy a shadcn-ready theme file with tokens, fonts, radius, shadows, and dark mode.

Open ->