Slopless Design

nav.broadsheet-section-rail · Section rail

A nav pattern from Broadsheet Newspaper, drawn alone below with this design's tokens and sample copy. Used in this design on: every page, as the nav. Give the section root data-pattern="nav.broadsheet-section-rail". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule

Between a 2 px and a 1 px rule: a small blackletter nameplate left, section links in caps in the middle, a 'Subscribe' text link right.

Slots

siteName, pages, cta

Grid areas

rail 1-12 (12-column grid, 1-based inclusive spans)

Tokens

bg #F4F0E6 · text #1B1A17 · heading #0D0C0A · accent #872824 · accent2 #BE6D65 · UnifrakturMaguntia / Newsreader · radius 0px · space unit 6px (full list in design/tokens.json)

Section

vertical padding step 1

Pattern notes

A 2 px rule, then one line: the nameplate small in blackletter on the left, section links in small caps in the middle, an underlined "Subscribe" text link on the right; then a 1 px rule. Phone: links scroll sideways.

Northfold

Services
Work
About
Contact

Start a project