UI Kit

The component system: geometric-grotesque display type over monospace body, one electric-lime accent, sharp corners, hairline borders.

Colour

Background
--background
Foreground
--foreground
Primary (lime)
--primary
Card
--card
Muted
--muted
Muted fg
--muted-foreground
Border
--border
Destructive
--destructive

Type scale

Display

Heading

Monospace body — the quick brown fox jumps over the lazy dog.

Mono label

Highlight marker

Bold statement. Loud where it counts.

A marker that wraps across every line it covers.

Buttons

Badges & icon badges

OutlineSolidAccent

Cards

Your Profile
A surface with a hairline border and sharp corners.
Quick Help
Cards compose a header, content and an arrow action.

Form fields

Toggle, radio & progress

Push notifications
70%