What is adidas's primary brand color?

adidas's captured marketing chrome has no chromatic primary at all. The brand color is black, full stop — the wordmark, headline, body copy, and most borders are all rendered in flat black with a frequency of 40 across the captured surface (20 as text, 18 as border, 1 as background fill for the button, 1 as shadow). White is the canvas and the button text color. The only non-monochrome tones are a 60%-grey used once as a sub-label color and a light-grey reserved for the text-input border. The heritage three-stripes orange, the football cobalt, and the running safety-yellow live in product photography, never in the brand chrome itself. This restraint is the brand's chromatic signature: trust the wordmark to carry the identity, refuse to assign that job to a hue.

What typeface does adidas use, and what should I use as a substitute?

The captured surface runs adineue (adidas's proprietary athletic grotesk, often labelled adineue Pro in design specs) across every display, body, and label tier. Display headlines sit at 25px / weight 700 in uppercase with normal letter-spacing, h3 section titles at 23.4px / 700, body paragraphs at 20px / 400, and footnote text at 16.67px / 400. Arial is the immediate fallback in the declared stack, and the primary button label deliberately renders in Arial at 16px / 500 — a brutalist functional choice that lets the CTA chrome read as system-default. The closest open-source substitute for adineue is Inter at weight 700 for display and weight 400 for body; for a tighter alternative with similar athletic proportions, use Anton or Bebas Neue at the uppercase display tier.

Why is the adidas marketing chrome entirely monochrome?

The brand identity is carried by the trefoil-plus-wordmark, not by a brand hue. adidas spends every chromatic budget inside product photography — the shoe is the color, the kit is the color, the campaign athlete is the color — and keeps the surrounding marketing chrome austere so the product never competes for attention. Where Nike will sometimes paint a full hero in volt or safety orange, and where Puma uses brand red as a fill behind the leaping cat, adidas treats black-on-white as the only acceptable chrome tone. The three product lines (Originals, Performance, SY) each carry their own product-color logic, but the parent surface stays monochrome. This is closer to the editorial restraint of a fashion-house masthead (CDG, Y-3, Off-White) than to a typical athletic-retailer marketing kit.

What corner-radius scale does adidas use?

The captured surface has exactly one radius value — 3px — and it is used twice: on the primary button (3px corners on a 14x32 padding, 46px height black fill with white text) and on the text input (3px corners on an 8px padding, 35px height white fill with a light-grey border). The button is almost-square; 3px is barely visible at the corner and reads functionally as a hard rectangle softened just enough to avoid feeling printed. There is no pill, no rounded large card, no fully-circular icon button anywhere on the captured surface. The scale is deliberately rectilinear — adidas's three-stripes geometry is parallel lines and right angles, and the chrome respects that vocabulary. The product detail pages elsewhere on the site introduce a fully-rounded swatch chip, but that is product surface rather than brand chrome.

Can I use this DESIGN.md to build my own apparel-retail marketing site?

Yes — the file is designed to be fed into Claude, Cursor, or any AI tool that reads structured design tokens. The agent will reproduce adidas's specific moves: pure black-on-white monochrome with no chromatic accent, adineue Pro across every display and body tier with Arial only inside button chrome, 3px almost-square button corners, uppercase weight-700 display mantras at 25px, and 20px as the dominant spacing module. You can also reference the tokens directly: every hex, font name, radius, and spacing value is a quoted scalar you can paste into Tailwind config or CSS variables. One caveat: the zero-chroma move only works if your brand identity is already carried by a wordmark or logomark this confident. For a new D2C apparel brand, holding at least one accent in reserve is usually the safer call.

adidas Design System

adidas's marketing chrome captured as a DESIGN.md spec.

About adidas DESIGN.md

Curated by Dov AzencotUpdated May 18, 2026Source adidas.com

E-commerce & Retail

adidas's marketing chrome does something almost no other global apparel brand does: it refuses chromatic identity entirely. The captured surface renders the trefoil-and-wordmark in flat black at the top of a white canvas, with an uppercase display headline beneath it in adineue Pro at 25px / weight 700, and a single grey "I am not a Robot" button at the bottom — and there is no other color on the page. Not the heritage orange of the three-stripes anniversary palette, not the cobalt of the football kit, not the safety-yellow of running. Where Nike paints its marketing surfaces with photography-driven warmth and a confident orange-on-black voltage, and where Puma leans on red and the leaping cat as inline punctuation, adidas keeps its chrome austere: ink on paper, with the wordmark doing the chromatic work that another brand would assign to an accent.

The DESIGN.md file packages the captured surface into a machine-readable spec for React and AI tools. Inside: four color tokens drawn from the structural tier — black for ink and button chrome (frequency 40, used as text, border, and fill), white for the canvas, a 60%-grey for sub-labels, and an 80%-grey hairline reserved for the text-input outline. Six typography tokens span adineue at 16.67px (small / footnote), 20px (body / paragraph), 23.4px (h3 / section), and 25px (h1 / uppercase display), plus Arial at 16px for the primary-button label and Arial at 15px for the text-input value. One radius value — 3px — is used twice, on the button and the input. Spacing centers on 20px as the dominant module, with 8px and 40px as the secondary steps.

Feed this file to Claude or Cursor and it will reproduce adidas's specific moves: pure black-on-white monochrome with no accent, adineue Pro for every display and body tier, Arial only inside button chrome (the captured surface deliberately falls through the system stack on the CTA — a brutal-functional choice), 3px almost-square button corners, and uppercase weight-700 display mantras at 25px. The one move worth borrowing only if your brand has a wordmark this confident: the willingness to put NO chromatic accent on the page. adidas gets away with it because the trefoil does every chromatic job a hue would do. Most retail teams need at least one held-in-reserve voltage.

What makes it distinct

Zero chromatic voltagethe captured surface uses only black, white, and two greys; no orange, no red, no signature shoebox color anywhere in the brand chrome
adineue across every tierthe proprietary athletic grotesk does display, body, and label work at 16-25px, with Arial only inside button chrome
Uppercase display mantrathe h1 sits in tracked uppercase weight 700 at 25px / 35px line height, a deliberate echo of the wordmark itself
3px button radiusalmost-square chrome at 14x32 padding and 46px height, with black fill and white text; no pill, no shadow
Wordmark-as-herothe trefoil-plus-lowercase-wordmark sits centered above the headline at the same visual weight, treating the logo as the page's largest typographic element

Live at adidas.com

A snapshot of the brand in production. Hover the frame to scroll the page; click to visit.

adidas.com

Explore adidas

Pick what you want to see — mockups, colors, typography, layout, or the full component list.

Surface

Page and card backgrounds.

Text

Headlines, body, captions, muted.

Borders & Hairlines

Dividers, outlines, structural rules.

adidas design system FAQ

Common questions about adidas's tokens, components, and how to use this DESIGN.md in your project.

Specs, directories, and component libraries that pair with this design system.

Browse all design systems

The full directory of DESIGN.md files on shadcn.io, with live mockups for each.

adidas — official site

adidas's public marketing site — the source of truth for the live tokens captured in this file.

The DESIGN.md specification

Google Labs' open spec for machine-readable design system files — the format this page is built on.