DANCE DESIGN SYSTEM Specimen sheet Vol. 01 / 2026

Specimen .

A pattern library for editorial dance-form sites.

01 / Color

Three sibling palettes on a common page.

Page

Paper #EFEBE3 page background
Paper deep #E5E0D4 meta-bar stamps
Ink #0A0A0A page foreground
Paper · dark #121214 page bg (dark mode)

Theme accents

Verdigris deep #2D5A4A wall.dance — on cream
Verdigris bright #6FAB95 wall.dance — on dark card
Corten deep #9B3F1F bungee.dance — on cream
Corten bright #D77043 bungee.dance — on dark card
Bronze deep #5C3D1F this specimen — on cream
Bronze bright #A78550 this specimen — on dark card

State

Focus #FFB400 keyboard focus ring
Error · on dark #FF8A7A form errors (light mode)
Error · on cream #B8281A form errors (dark mode)
02 / Type

Display, body, mono.

DM Serif Display · Italic Headlines · drop caps
Specimen.
Fraunces · Variable, optical sizing Body copy · ledes

Fraunces is a display-meets-text variable face with editorial bones — flare in the stem terminals, fine optical sizing axis. Set at 17–19px for body, larger for ledes, italic for emphasis.

Space Mono · Bold + Regular Eyebrows · footers · metadata

Eyebrow / Footer label / 11px · letter-spacing 0.18em · uppercase

03 / Space

An eight-step scale, from gutter to chapter.

--space-1 · 8px
--space-2 · 16px
--space-3 · 24px
--space-4 · 32px
--space-5 · 44px · page gutter
--space-6 · 64px · two-col gap
--space-7 · 80px · footer padding
--space-8 · 120px · section padding
04 / Editorial elements

Pull quote, body copy, inline accents.

The wall becomes the stage. The body relearns where it is.

Body copy is set in Fraunces with optical sizing tuned for sustained reading. Maximum measure is 42 characters, which keeps prose readable without dropping into newspaper-column tightness.

Inline accents like this italic emphasis and links such as this one are styled to read as native prose, never web-styled. Links carry a single-pixel underline in the page accent.

05 / Signup card

The inverted-color moment.

06 / Theme variations

Same components. Different oxidation.

Verdigris
Wall .

Choreography for gravity's other axis.

→ wall.dance