Palette
Typography
Summary
Il modulo di richiesta: nome, email, livello, numero di ospiti e una nota. Non parte niente finché i campi non sono validi — il campo sbagliato si segna, il primo prende il fuoco — e all'invio la sezione non cambia pagina: si trasforma in una risposta che chiama l'ospite per nome e cita il livello che ha scelto. Perché conta: la richiesta è l'unica cosa che la pagina chiede davvero. Portarla via, anche solo per un ricaricamento, è il punto in cui si perde la gente: qui la conferma arriva dove stava già guardando.
Style
A printed championship programme rendered as a film: editorial serif over full-bleed footage, gold hairlines, and a permanent grain over everything.
Two palettes doing two jobs, never mixed. INSTITUTION, used for frames, bars and dark grounds: deep green #06231a, green #0a3d28, brand green #007649, deep purple #241238, purple #3d2360, brand purple #593987, light purple #b39ddb. LUXURY, used for every surface the reader actually sits on: cream #f7f1e4, soft cream #efe6d3, champagne #e7d6ac, gold #b8933f, light gold #d6b464, deep gold #8f6f28. Ink is #23180d, softened to 68% for body and 42% for captions; on dark grounds the chalk is #f7f1e4 at 72%. Gold is a hairline and a rule, never a fill — no gold buttons, no gradients on type. Two typefaces with separate jobs: EB Garamond (standing in for A Caslon Pro) for every display line, every pull quote and every price, italic for the second half of a headline so the sentence turns; Montserrat (standing in for Gotham) for eyebrows, labels, nav and form, always uppercase at 0.28–0.4em tracking, never above 12px. Headlines run on clamp() from 22px to 34px for the loader word and up to 1.02 line-height at section scale — set them by viewport, never at a fixed size. Gutter is clamp(22px, 6vw, 120px) and holds on every section. One easing everywhere: cubic-bezier(0.22, 0.61, 0.24, 1). A film-grain layer sits above the entire document at low opacity and shifts its background position on a timer, so the page is never perfectly still.
Layout & structure
Una sola sezione, presa dalla pagina a cui appartiene.
La sezione
Il modulo di richiesta: nome, email, livello, numero di ospiti e una nota. Non parte niente finché i campi non sono validi — il campo sbagliato si segna, il primo prende il fuoco — e all'invio la sezione non cambia pagina: si trasforma in una risposta che chiama l'ospite per nome e cita il livello che ha scelto.
Notes
Perché conta: la richiesta è l'unica cosa che la pagina chiede davvero. Portarla via, anche solo per un ricaricamento, è il punto in cui si perde la gente: qui la conferma arriva dove stava già guardando.
Meta
- Author
- Silvio Luchetti
- Published
- yesterday
- Remixes
- 0
- Views
- 0