hero.luxury-cropped-portrait · Cropped portrait

A hero pattern from Luxury Fashion, drawn alone below with this design's tokens and sample copy. Not used in this design: shown with its tokens for comparison. Give the section root data-pattern="hero.luxury-cropped-portrait". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
A vertical tiny-caps label runs up column 1; a 3:4 portrait fills 4–8; the italic Didone headline, a caps line and an underline link are bottom-aligned on 9–12.
Slots
eyebrow, heroImage, headline, subhead, cta
Grid areas
label 1-1 · portrait 4-8 · text 9-12 (12-column grid, 1-based inclusive spans)
Notes
Columns 2–3 stay empty. The label reads bottom-to-top.
Tokens
bg #FAF8F4 · text #1A1A1A · heading #0A0A0A · accent #111111 · accent2 #5C4311 · Bodoni Moda / Jost · radius 0px · space unit 8px (full list in design/tokens.json)
Section
vertical padding step 8

Pattern notes

  • A tiny caps label rotated −90° reads bottom-to-top in column 1 (hidden on phone). Columns 2–3 are empty. A 3:4 portrait fills 4–8. Columns 9–12, bottom-aligned: the headline at step 5, italic, weight 400, max ~9 characters per line; a caps line (max 30 ch); a small underline link. The hero is a full viewport tall.

We make complicated companies simple to choose

Northfold is a 14-person studio helping manufacturers, labs and B2B teams explain what they do — and look like they mean it.

Start a project