Skip to content
Library

Firstandforemost. Protest poster on cream paper.

  • Studio
  • Light theme
  • 5 colors
  • 1 typeface

First+Foremost is a monochrome canvas charged by a single vivid orange — a design system that treats one color as a loudhailer rather than a decoration. The aesthetic is editorial and protest-poster: vast white paper, giant thin sans-serif type that bleeds past the viewport, botanical line-art illustrations in the same orange, and pill-shaped controls with 80px radii. Layout is centered and breathing; content sections are either full-white statements or full-orange broadcasts with no middle ground. Photography is limited to circular black-and-white portrait crops on the orange field. The rhythm alternates between silence (white space, thin weight) and shouting (200px display, solid orange band).

Screenshot of Firstandforemost
Captured from firstandforemost.co on October 11, 2026

Firstandforemost design system

Firstandforemost

Brand1

  • Brand color saturating hero text, navigation borders, section backgrounds, body text accents, and icon strokes — the only chromatic voice in the system; treated as both ink and fill

Neutrals4

  • SVG illustration fill, icon weight, photographic subjects — black only, never used for body text on white

  • Hairline border accent on the orange field, low-contrast divider where #ff4501 would be too loud

  • Tertiary surface — soft peach band at the foot of white sections, footer background, subtle warmth under statement blocks

  • Primary canvas and card surface; text-on-orange and image borders

Try a pairing

Pick any two colors from the palette to check whether text stays readable on top.

Aa

Carbon Ink on Signal Orange

6.10 : 1 contrast

Background
Text
  • Body textPasses AA 4.5
  • Large textPasses AA 3
  • StrictFails AAA 7

More DESIGN.md files. Same web, different personalities.