Skip to content
Library

Allbirds. Natural materials on white linen.

  • Commerce
  • Light theme
  • 10 colors
  • 3 typefaces

Allbirds runs on quiet, natural confidence — a near-totally achromatic canvas punctuated by warm sand (#e0dacf) and muted earth tones lifted directly from the product photography. The UI stays out of the product's way: white surfaces, hairline borders, uppercase tracking-heavy nav, and pill-shaped controls that feel like physical buttons rather than web elements. Self Modern (a custom serif) is reserved for the few moments of editorial weight — hero headlines and collection names — while Geograph carries every label, body line, and button at three disciplined weights. Category cards become the color system: each one takes its background swatch from the product it features, turning the navigation into a living Pantone deck.

Screenshot of Allbirds
Captured from allbirds.com on October 11, 2026

Allbirds design system

Allbirds

Neutrals10

  • Headlines, icons, high-contrast borders, nav text

  • Supporting neutral for secondary UI, dividers, and muted labels. Do not promote it to the primary CTA color

  • Supporting neutral for secondary UI, dividers, and muted labels. Do not promote it to the primary CTA color

  • Secondary text, helper copy, subtle borders

  • Outlined button border color

  • Muted borders, disabled dividers, footer separators

  • Soft shadow tone for elevated elements

  • Hero section background, secondary surface tone, large editorial panels

  • Tertiary surface, subtle nav tint, warm off-white alt background

  • Page backgrounds, card surfaces, product card backgrounds

Try a pairing

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

Aa

Canvas White on True Black

21.00 : 1 contrast

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

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