Slopless Design

nav.brutalist-text-links · Text links

A nav pattern from Brutalist, 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.brutalist-text-links". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule

One line: the site name as plain bold text, slash-separated underlined links, and a mono version stamp on the right; a 2 px rule underneath.

Slots

siteName, pages, meta

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)

Section

vertical padding step 1

Pattern notes

A single row, space-between: the site name in bold body type (no logo mark), the page links separated by " / " and underlined in the accent colour, and a mono small stamp (version, date or "updated 3m ago"). A 2 px rule closes it. At phone width the links scroll horizontally.

Northfold

Services
/
Work
/
About
/
Contact

Booking projects from June 2026