components — default
The site's own surface — near-monochrome, cool slate, oklch end-to-end. Inherits @creative-int/design defaults with restraint.
palette
8 tokens — every primitive in @creative-int/design reads from these via var(--*).
surface
background
page
L 1 / C 0 / H 0
background-secondary
panel
L 0.97 / C 0.003 / H 264
background-tertiary
subtle
L 0.94 / C 0.004 / H 264
foreground-secondary
muted
L 0.32 / C 0.008 / H 264
foreground-tertiary
tertiary
L 0.5 / C 0.01 / H 264
text
foreground
text
L 0.14 / C 0.005 / H 264
line
border
rule
L 0.91 / C 0.004 / H 264
accent
primary
accent
L 0.16 / C 0.005 / H 264
typography
Stack: ui-sans-serif, system-ui, -apple-system, sans-serif
Weights: 400 / 460 / 500
400 · specimen typography
460 · specimen typography
500 · specimen typography
Same primitives, different voice. The measured paragraph keeps body rhythm visible instead of relying on a single display line.
radii
5 values in the corner scale.
sm
4px
md
6px
lg
10px
xl
14px
card
18px
in context
A bounded preview surface using this style's tokens. Drop real primitives in here without reaching for any other CSS.
specimen
Workspace preferences
The same button and keyboard anatomy dressed in this token sheet.