Screenshot of Alo Yoga

Alo Yoga

www.aloyoga.com

an aspirational activewear and yoga store that runs almost pure black-on-white, lets full-bleed editorial photography fill the frame, and adds personality through one handwritten-italic serif overlay and disciplined image-grid merchandising.

Fitness Activewear Yoga strong

Design tokens

primary
charcoal
mine
chicago
dawn
alto
mercury
smoke
white
sand
highlight
accent
display
proxima-nova italic (editorial overlay)
body
proxima-nova
secondary
arquitecta (Latinotype)
mono
none

Do / Don't

Reference it for

  • A yoga / activewear / studio-retail brand wanting an aspirational, image-led feel: near-monochrome chrome, full-bleed lifestyle photography, almost no UI furniture.
  • An editorial italic display overlaid on a hero image as the single personality move against an otherwise clean sans system.
  • Disciplined merchandising rails: a small uppercase category label, an image grid, a "Shop X" link, repeated as the page rhythm.
  • A deeply tokenised neutral system (named greys, a 4-120px spacing scale, shadow levels) that keeps a large Shopify catalogue consistent.
  • Light, tasteful motion (0.3s colour, 0.6s transform) that supports rather than performs.

Do not copy

  • The "alo" wordmark, the golden-hour brand photography, and proxima-nova / arquitecta are Alo's identity; map to a comparable clean grotesque and source your own lifestyle imagery.
  • The Shopify + Builder.io machinery and 182 custom properties are an enterprise retail apparatus; borrow the token discipline, not the volume.
  • Pure black-on-white with full-bleed photography only works with consistently styled, professionally shot images.

Signature moves

near-monochrome image-led merchandising

almost pure black-on-white chrome with full-bleed editorial photography filling the frame and almost no UI furniture, depth from a deeply tokenised neutral grey system.

single italic-display overlay personality move

one handwritten-italic serif (proxima-nova italic) overlaid on a hero image is the single personality move against an otherwise clean sans system.

repeated label-grid-link merchandising rail

a small uppercase category label, an image grid and a Shop X link repeat as the page rhythm.