Skip to content
Library

Apple iPhone Duo. Foldable device in a white gallery.

  • Commerce
  • Light theme
  • 11 colors
  • 3 typefaces

Apple treats the product page as a white gallery: enormous product photography occupies the center while compact black typography gives each claim a controlled, almost editorial weight. The page alternates seamless white storytelling sections with #f5f5f7 feature bands containing oversized #ffffff cards, using one saturated blue only for links and compact conversion controls. Rounded 28px media frames soften the hardware-led composition without turning the page into a card dashboard; nearly every surface stays flat and shadowless.

Screenshot of Apple iPhone Duo
Captured from apple.com on October 11, 2026

Apple iPhone Duo design system

Apple iPhone Duo

Brand2

  • Inline links, section links, and blue text controls — a precise blue punctuation against monochrome product storytelling

  • Filled pricing and learn-more controls — the brighter blue reserves visual urgency for compact conversion moments

Accent1

  • Small launch-status labels such as new-product markers

Neutrals8

  • Headlines, primary body copy, navigation labels, and dark utility icons

  • Secondary copy, legal text, subdued navigation content, and low-emphasis glyphs

  • Input outlines, inactive indicators, and fine outlined-control edges

  • 1px dividers, restrained control outlines, and subtle separators

  • Disabled control fills, subdued utility surfaces, and single-pixel navigation edge treatment

  • Alternate full-width section background, feature-stage backdrop, footer surface, and muted content blocks

  • Opened global-navigation surface and secondary pale fill

  • Primary page canvas, hero background, product story sections, and feature-card surfaces

Try a pairing

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

Aa

Gallery White on Apple Blue

5.57 : 1 contrast

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

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