Raw Concrete
wildcardlightA brutalist, raw take: exposed structure, heavy black hairlines, oversized grotesk type, and unapologetic boxes with zero radius. Beautiful precisely because nothing is hidden.
- Mood
- raw, bold, structural, unflinching
- Palette
- Stark concrete-gray and bone-white with pure-black ink rules and one jarring safety-orange accent.
- Heading / Sans / Mono
- Space Grotesk · Public Sans · Spline Sans Mono
- Motion
- Abrupt and honest - hard cuts and instant state changes, motion only where it serves function.
Color tokens
The live shadcn token contract for the active theme + mode. Swap themes above to watch every surface update.
Typography
Heading, body, and mono faces shift per theme via font-heading / font-sans / font-mono.
Build things that matter.
The quick brown fox jumps over the lazy dog. Body copy set in Public Sans — the workhorse for paragraphs, labels, and UI.
const ship = () => deploy(/* Spline Sans Mono */)
Radius & elevation
Corner radius and shadows scale from the theme's --radius.
Components
The full shadcn surface, themed by the active token set.
Buttons
Badges
Form controls
Slider & progress
Select
Tabs
Accordion
Overlays & feedback
Card & avatar
Motion lab
A spread of motion treatments — each driven by the active theme's spring personality. React to these to steer the site's feel.
Every demo is parameterized by Raw Concrete's motion personality: Abrupt and honest - hard cuts and instant state changes, motion only where it serves function.