list.bauhaus-numbered-blocks · Numbered blocks

A list pattern from Bauhaus, 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="list.bauhaus-numbered-blocks". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
Each item is one row under a 4 px bar in the heading colour: its number in a solid accent2 square on 1–2, title on 3–7, text on 8–12; one more 4 px bar closes the list. No hairlines.
Slots
sectionLabel, title, items[3..6]
Grid areas
number 1-2 · title 3-7 · body 8-12 (12-column grid, 1-based inclusive spans)
Tokens
bg #FDF9F4 · text #241E16 · heading #150E06 · accent #0050CC · accent2 #AF0029 · Jost / Jost · radius 0px · space unit 8px (full list in design/tokens.json)

Pattern notes

  • Section label (lowercase eyebrow) and h2 above. Each item: a solid accent2 block on 1–2 holding the number in onAccent2 at step 4 (weight 700), the title (h3, lowercase) on 3–7 and one paragraph on 8–12, top-aligned. A 4 px bar in the heading colour runs above every row and one more closes the list; no hairlines. At phone width the number block sits above the title as a 64 px square.

Index

Services

01

Discovery sprint

Two weeks of interviews, audits and competitor teardown.

02

Positioning workshop

A day with your leadership to agree on one story.

03

Identity design

Logo, type, colour, motion and a working toolkit.

04

Website

Strategy, copy, design and build in Webflow or Next.js.