A stark monochrome system where black ink does almost all the work on a white canvas — squared corners, flat surfaces, technical AdihausDIN type, and a single hot sale-red allowed to break the black-and-white.
AdihausDIN is adidas's proprietary humanist-DIN sans; shown here substituted with Barlow from Google Fonts. Hierarchy is built from weight and tracking more than size — note the wide-tracked uppercase section heads.
Product cards are flat and square — a white surface, no shadow at rest, a square image, a bold title and price. Sale prices flip to red; hover reveals quick-add.
A 4px base unit, with 16px as the workhorse rhythm — nav items, module gutters and card padding all resolve to multiples of 4 and 8.
Effectively a zero-radius system. Corners are hard and square on buttons, cards, inputs and chips; rounding is reserved for genuinely circular elements like carousel dots.
| Name | Width | Key changes |
|---|---|---|
| Mobile | < 768px | Single-column product grid; category nav collapses to a hamburger; promo strip + search persist; headlines shrink but keep weight & tracking. |
| Tablet | 768–1023px | Product grid steps to 2 columns; utility nav condenses; the mega-menu becomes tap-to-expand. |
| Laptop | 1024–1279px | 3–4-up product grids; full horizontal category nav; edge-to-edge media teasers. |
| Desktop | ≥ 1280px | Wide max-width canvas; 4-up grids; a two-row ~121px header with the promo strip above the main nav. |
Squared corners and the black-on-white discipline hold at every breakpoint — the system barely bends.
adidas has no pricing page, so the tier-card pattern is shown here as adiClub's points-based loyalty levels — illustrative content built from the real component styling.
A data-table pattern in the account area — square frame, hairline rows, uppercase status pills. Statuses borrow the system's two accents: green for delivered, red for returned.
| Order | Product | Size | Status | When |
|---|---|---|---|---|
| PH-48201 | Ultraboost Light | 9 UK | Delivered | Jun 22 |
| PH-48196 | Samba OG | 8 UK | In transit | Jun 25 |
| PH-48190 | Tiro 24 Jacket | M | Processing | Jun 26 |
| PH-48172 | Adizero Adios Pro 3 | 10 UK | Delivered | Jun 18 |
| PH-48165 | Predator Elite FG | 9.5 UK | Returned | Jun 12 |
Sign-in and join forms reuse the grey-filled square inputs and the solid black CTA — illustrative content demonstrating the form pattern.