Sample pageColorsTypographyComponentsMembersJoin form
Foundations

Colors

Wrap any block in tone-night (or toggle Dark) and every token inverts.

Aa
bg-canvas

Page background

Aa
bg-surface

Badges, inputs, soft cards

Aa
bg-surface-strong

Tags, hover fills

Aa
bg-ink

Headlines, dots, lines

Aa
text-ink-muted

Secondary copy

Aa
text-ink-faint

Fading statement words, idle tabs

Aa
bg-sky

Primary buttons, hero sky

Aa
bg-sun

Ribbons, highlights

Aa
bg-paper

Editorial form panels

Aa
bg-mint

Selected stories, accents

Aa
bg-lilac

Supporting editorial panels

Aa
bg-signal

High-energy feature panels

Aa
bg-lic

Long Island City

Aa
bg-sunnyside

Sunnyside

Aa
bg-astoria

Astoria

Aa
bg-jackson-heights

Jackson Heights

Aa
bg-elmhurst

Elmhurst

Aa
bg-forest-hills

Forest Hills

Aa
bg-rego-park

Rego Park

Aa
bg-canvas

Page background

Aa
bg-surface

Badges, inputs, soft cards

Aa
bg-surface-strong

Tags, hover fills

Aa
bg-ink

Headlines, dots, lines

Aa
text-ink-muted

Secondary copy

Aa
text-ink-faint

Fading statement words, idle tabs

Aa
bg-sky

Primary buttons, hero sky

Aa
bg-sun

Ribbons, highlights

Aa
bg-paper

Editorial form panels

Aa
bg-mint

Selected stories, accents

Aa
bg-lilac

Supporting editorial panels

Aa
bg-signal

High-energy feature panels

Aa
bg-lic

Long Island City

Aa
bg-sunnyside

Sunnyside

Aa
bg-astoria

Astoria

Aa
bg-jackson-heights

Jackson Heights

Aa
bg-elmhurst

Elmhurst

Aa
bg-forest-hills

Forest Hills

Aa
bg-rego-park

Rego Park