Slopless Design

nav.synthwave-neon-rail · Neon rail

A nav pattern from Synthwave Retro-Future, 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.synthwave-neon-rail". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule

Boxed logo, slash-separated mono links and a small glowing primary button on one line, over a 2 px neon rule.

Slots

siteName, pages, cta

Grid areas

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

Tokens

bg #0E0B1F · text #EDE6FF · heading #FFFFFF · accent #FE2D6D · accent2 #00A59F · Orbitron / Space Grotesk · radius 2px · space unit 8px (full list in design/tokens.json)

Section

vertical padding step 2

Pattern notes

One line: boxed logo (neon outline), slash-separated links in mono uppercase, a small glowing primary button; a 2 px neon rule under the bar with a soft glow. Phone: links scroll sideways.

Northfold

Services
/
Work
/
About
/
Contact

Start a project