Unboring starter reference

Design system

A live reference for the approved visual language, content states, and reusable editorial components.

Typography

Editorial hierarchy makes the first idea unmistakable.

Use generous display moments for the page-level idea, then let clear, compact body copy carry context and decisions.

Metadata, labels, and supporting details use the smaller step with deliberate contrast.

Colors

Background

Foreground

Surface

Surface strong

Accent

Buttons and links

Inline links remain clearly identifiable without needing a separate component.

Hero variants

Project cards and missing images

These live cards deliberately have no featured images, so the approved missing-image treatment remains visible to editors.

Image treatments

Landscape 4:3

Portrait 3:4

Cinematic 16:9

Metadata