Geist · specimen

Geist dark

Kevin’s Vercel kit. Dark field, inverted ink, four signals. Same tokens as the product — open the file, there is no build.

Monochrome does hierarchy. Chromatic is a signal.

Field background
True black background-200
Ink foreground
Muted muted
Subtle subtle
Elevated surface-elevated

Info

soft
solid
border

Correct

soft
solid
border

Hint

soft
solid
border

Incorrect

soft
solid
border

Pending

soft
solid
border

Geist Sans for UI. Geist Mono for eyebrows, keys, and meta.

48 / 56−2.88 · 600

Dark field

40 / 48−2.4 · 600

Dark field

32 / 40−1.28 · 600

Dark field

24 / 32−0.96 · 600

Dark field

20 / 26−0.4 · 600

Dark field

16 / 24−0.32 · 600

Dark field

14 / 20−0.28 · 600

Dark field

16 / 24copy · 400

Monochrome does hierarchy. Color does meaning.

14 / 20copy · 400

Body default is 14 on 20, Geist Sans, antialiased.

13 / 18copy · 400

Secondary note. Same measure, quieter ink.

12 / 16label · mono

Eyebrow · meta

14 / 20button · 500

Continue

4px base. Hairlines, not boxes.

Spacing

4px base. Prefer 8, 12, 16, 24, 32, 48, 64.

4
8
12
16
24
32
48
64

Radius

6 / 8 / 12 / 16. Controls default to 8. Cards are 12.

6
8
12
16

Control height

Small 32. Default 36. Large 40.

32 · sm
36 · default
40 · lg

Color names a state. Never decoration.

Info Correct Hint Incorrect Pending

What

A standalone specimen of the Geist / Vercel kit. Tokens, type, space, and a few atoms. The page a future DESIGN.md will point at.

Why

Agents and humans need to see the system, not only read it. CRAFT is the bar. This file is the look.

Not

Not a component gallery. Not a learning-lab shell. Not a second type scale or a fifth accent.

Felt, not watched. Transform and opacity only.

Duration

150ms fast
200ms normal
300ms slow
400ms enter

Enter stagger

One

0ms · fadeUp

Two

60ms · fadeUp

Three

120ms · fadeUp

Press

Morph

Same heights and radius as the product.