Patterns
Landing page
A marketing page layout. Display hero, dashed dividers, marquee, pill CTAs. Rendered inside a desktop frame to show how it looks as a shipped site.
Live preview
kairoz-live.vercel.app
Kairoz
Design System · v0.2
A CSS design system for
dense, multi-surface UIs.
Framework-agnostic tokens and 50+ component classes for dashboards, mobile views, and landing pages.
AMOLED BLACK◆40+ COMPONENTS◆MULTI-SURFACE◆DARK + LIGHT◆FRAMEWORK-AGNOSTIC◆AMOLED BLACK◆40+ COMPONENTS◆MULTI-SURFACE◆DARK + LIGHT◆FRAMEWORK-AGNOSTIC◆
Dense by default
28px buttons, 13px base, 4px grid. Compact layouts without sacrificing readability.
Styled, not bare
Pill buttons, glass effects, understated motion. Components with visual polish built in.
Multi-surface
Desktop shells, mobile views, web landing pages — one set of tokens and classes.
Start building
Drop the CSS into any stack. Tailwind, React, Vue, plain HTML — it just works.