content.constructivist-angled-columns · Banner columns

A content pattern from Constructivist, drawn alone below with this design's tokens and sample copy. Used in this design on: about page, section 1. Give the section root data-pattern="content.constructivist-angled-columns". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
A stacked capital title on 1–3, top-aligned; an 8px bar on 4–12 opens two text columns 4–8 and 9–12.
Slots
title, body, body2
Grid areas
title 1-3 · bar 4-12 · col1 4-8 · col2 9-12 (12-column grid, 1-based inclusive spans)
Tokens
bg #EFE6D2 · text #16130F · heading #16130F · accent #C8102E · accent2 #FF7777 · Anton / Barlow Semi Condensed · radius 0px · space unit 8px (full list in design/tokens.json)

Pattern notes

  • For about and article pages: the title in capitals at step 5 stacks on 1–3, top-aligned; an 8 px bar on 4–12 opens two text columns, 4–8 and 9–12 (max 48 ch).

How we think

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

We hand over everything — source files, a living brand system and a website your team can edit without calling us.