testimonial.brutalist-shout-quote · Shout quote

A testimonial pattern from Brutalist, drawn alone below with this design's tokens and sample copy. Used in this design on: home page, section 6. Give the section root data-pattern="testimonial.brutalist-shout-quote". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
A mono label in columns 1–2, top-aligned; the quote in a bordered box across 3–12, uppercase at step 4, heaviest weight; author and role in mono below.
Slots
sectionLabel, quote, author, role
Grid areas
label 1-2 · quote 3-12 (12-column grid, 1-based inclusive spans)
Tokens
bg #FAFAFA · text #1F1F1F · heading #0F0F0F · accent #012FD3 · accent2 #4980FE · Space Mono / Space Mono · radius 0px · space unit 8px (full list in design/tokens.json)

Pattern notes

  • Columns 1–2: the section label, mono uppercase, top-aligned and never rotated. Columns 3–12: one box with a 2 px border holding the quote in uppercase at step 4, heaviest weight, no quotation-mark glyph ornament, then author and role in mono small, separated by " — ". At phone width the label sits above the box and the quote drops to step 3.

Kind words

“They understood our product faster than our own sales team did.”

Hanna Lindqvist

CEO, Corvid Robotics