Design system · Fall 2026
The world of Coach,as a system.
Everything Coach’s digital pages are made of: the brand’s type, colour and voice, the components and blocks that build a page, and the prototypes that put them to work, project by project. First up, Coach Stories.
- Typefaces
- 3
- Cuts
- 11
- Colours
- 8
- Prototypes
- 4





Four ways in
Read the guidelines for the why, the components and blocks for the what, the prototypes for how it feels.

01
Guidelines
Brand, voice, logo, type, colour, layout, imagery, icons and motion: the rules the hub is built on.

02
Components
The parts: the store tabs, buttons, links and fields, and the story cards and category rail Coach Stories adds. Live, with their props.

03
Blocks
The sections those parts make: the storefront header and footer, and the hero, story grid and bands of Coach Stories. At desktop and mobile widths.

04
Prototypes
Project by project. Coach Stories first: the hub as drawn, and three more ways to tell it.
Project 01 · Coach Stories
Explore the world of Coach
One place for the stories Coach tells, sitting inside coach.com and wearing its clothes: the same store tabs, header and footer, the same Helvetica and Garamond, the same restraint. The design came in two frames, built here as drawn and responsive. Three more prototypes answer the same brief in different ways, so the conversation can be about which, not whether.
- 01As designedThe design's two frames, desktop and mobile: straight into the grid, or led by a hero.
- 02MagazineThe same stories published as an issue, section by section.
- 03IndexType first, pictures on demand: a filterable archive.
- 04Full bleedImage first: every story takes the screen, like a campaign microsite.