Skip to content
Browse
Library

Apple AirPods 5. Cinema on white.

  • Commerce
  • Light theme
  • 11 colors
  • 2 typefaces

Apple AirPods pages pair an almost clinical white editorial canvas with immersive full-bleed films that shift from amber performance art to electric blue soundscapes. Product navigation is exceptionally thin and quiet, while the product itself is introduced through oversized SF Pro Display headlines, restrained 600 weight, and large cinematic media panels rather than decorative UI. Bright blue appears only as concise purchase and text-link punctuation; large rounded controls, translucent media overlays, and near-shadowless surfaces keep attention on the film frame.

Visit apple.com
Screenshot of Apple AirPods 5
Captured from apple.com on October 11, 2026

Apple AirPods 5 design system

Apple AirPods 5

Brand1

  • Filled purchase buttons and keyboard focus treatment — a concentrated blue mark against otherwise neutral controls

Accent1

  • Text links, film links, and inline disclosure affordances

Neutrals8

  • Primary headlines, body copy, dark media cards, and dark iconography

  • Secondary editorial copy and supporting headings

  • Muted explanatory copy and de-emphasized labels

  • Hairline section and footer dividers

  • Pale media-control and subdued action backgrounds

  • Alternate section backgrounds, quiet cards, footer bands, and pale control surfaces

  • Global navigation fill, light product panels, light icons, and inverse text

  • Primary document canvas and white-on-dark display text

semantic1

  • New-product labels and limited-status annotations

Try a pairing

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

Aa

Studio White on Apple Blue

4.70 : 1 contrast

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

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