Style
Guide
A complete reference for the cwclark.com design system — typefaces, colour, grid, spacing, components, and graphic primitives. Every element on the site originates from these definitions.
Type
Two typefaces govern the system: Neue Haas Grotesk for all editorial and UI text (display 700 for headings, text 400 for body), and TG Frekuent Mono for all instrument, data, and label use.
Palette
A strictly monochrome system. Four tones only — black for all foreground and border, data grey for secondary text and labels, rule for subtle dividers, and white as the universal ground.
Black
Data Grey
Rule
White
Grid
8px baseline grid. All spacing values are multiples of 8. The content column maxes at 1200px with 24px horizontal padding. Row gutters are 16px (2 × 8).
Schematics
Layout
The editorial split is the foundational layout pattern. A 1:2 grid divides the viewport — heading mass left, body copy right. 1px black rules define sections. Extreme white space between.
Title
Neue Haas 700
clamp(4rem,10vw,9rem)
line-height: 0.95
Introductory paragraph text sits to the right of the display heading — wider column, constrained to ~42 characters, neue haas grotesk text 400, 0.889rem.
Body intro · Neue Haas Text 4000.889rem · max 42ch · line-height 1.56