Screenshot of Lando Norris

Lando Norris

www.landonorris.com

an athlete portfolio masquerading as a sport-magazine - dark olive #282c20 page, cream type, oversize "WORLD DRIVERS' CHAMPION" headlines in the bespoke Brier display font, neon-papaya #d2ff00 for the STORE pill, and a Webflow + Lenis + Splitting motion stack delivering a slow 0.75s expo-out cinematic reveal on every editorial card.

Personal Brand Athlete Portfolio flagship

Design tokens

olive-page
olive-deep
olive-darker
cream-text
cream-soft
papaya-neon
papaya-deep
ink-near-black
olive-mid-grey
pure-black
display
Brier, Arial, sans-serif
body
"Mona Sans Variable", Arial, sans-serif

Do / Don't

Reference it for

  • The dark olive + cream + neon-papaya palette — three colours doing the entire athlete brand. The neon-yellow is reserved for the STORE button and one or two oversize emphasis splashes; the rest of the page is cream-on-olive.
  • The Brier display + Mona Sans Variable pairing for sport / portfolio sites that need both editorial reading and athletic-magazine punch.
  • Editorial asymmetric photo grids for each section — a portrait card top-left, the dominant action shot centre, a landscape behind the cockpit right, a small bio quote inset somewhere. Each section is a magazine spread.
  • The 0.75s cubic-bezier(0.65, 0.05, 0, 1) reveal curve — slow expo-out applied to opacity, color, transform, and clip-path (the clip-path reveal is the most distinctive — it wipes text in from one side rather than fading).
  • Lenis smooth scroll for athletic-portfolio brands where the scroll IS the experience.
  • A floating "STORE" CTA button in neon-papaya at the top-right of every viewport — high-contrast against the olive page, instantly readable as the commerce destination.
  • A NEXT RACE micro-card floating at the bottom-left — small ticket-shaped tile showing the next Grand Prix circuit silhouette + name (e.g. "MONACO GP") and a small "McLaren F1 since 2019" stamp. Personality detail that anchors the site to the racing calendar.
  • Sport-magazine eyebrow labels (small uppercase Mona Sans 8.33px) on each photo card.

Do not copy

  • Brier — bespoke or low-volume display licence (likely by Off Brand, Lando's design partner — visible in third-party domains assets.itsoffbrand.io, lando.itsoffbrand.io). Not directly portable.
  • The exact #d2ff00 neon-papaya — McLaren-coded; Lando's specific shade is even more brand-tied.
  • McLaren-papaya signatures (the cockpit photography, championship merch designs) — bespoke commissions for this specific brand.
  • Lenis on every Jiffi build — adds ~15KB gzip and adds smoothness mostly for taste reasons. Use only on portfolios that genuinely need cinematic scroll feel.
  • Splitting.js if the brief only needs scroll-fade reveals — over-kill for non-typographic-animation use cases.
  • The fractional pixel sizing (8.33, 13.33, 16.67px) which suggests rem-based scaling at a 16px root with 0.83 sub-divisions — converts directly only if the rebuild adopts the same root font-size convention.
  • 68 image requests on a single page — visually rich but a perf cost worth subsetting.

Signature moves

editorial asymmetric magazine-spread grids

each section is a magazine spread of asymmetric photo cards (a portrait top-left, the dominant action shot centre, a landscape behind right, a small quote inset) with sport-magazine eyebrow labels in ~8.33px caps Mona Sans

clip-path wipe reveal on expo-out curve

the signature entrance is a 0.75s cubic-bezier(0.65,0.05,0,1) expo-out applied to opacity, colour, transform and clip-path, where the clip-path wipes text in from one side rather than fading

floating commerce + next-event micro-cards

a floating neon-papaya STORE CTA sits top-right of every viewport and a ticket-shaped NEXT RACE micro-card floats bottom-left showing the next event circuit silhouette, name and a small "since 2019" stamp