hero.neo-grotesk-index-sheet · Index sheet

A hero pattern from Neo-grotesk Minimal, 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.neo-grotesk-index-sheet". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
Label and headline (step 5, weight 500) on 1–4; a hairline-ruled fact sheet of three to five label/value rows on 7–12, with a small outlined button under it.
Slots
eyebrow, headline, facts[3..5], cta
Grid areas
heading 1-4 · facts 7-12 · cta 7-9 (12-column grid, 1-based inclusive spans)
Tokens
bg #FAFAFA · text #1F1F1F · heading #0F0F0F · accent #F95620 · accent2 #9E2C00 · Geist / Geist · radius 2px · space unit 8px (full list in design/tokens.json)

Pattern notes

  • Columns 1–4: a tiny uppercase label and the headline at step 5, weight 500, max ~14 ch. Columns 7–12: three to five fact rows separated by hairlines, each a label (small, uppercase, tracked) on the left and its value (small, muted) on the right; then a small outlined button. Columns 5–6 stay empty. At phone width the fact sheet follows the headline.

Brand & product studio

We make complicated companies simple to choose

Hours

Studio open Mon–Thu, 9:30–18:00

Where

Rua da Boavista 72, 1200-066 Lisboa

Contact

+351 21 340 5512

Good to know

Booking projects from June 2026

Start a project