nav.seventies-rounded-tab · Rounded capsule bar

A nav pattern from Seventies Psychedelic, drawn alone below with this design's tokens and sample copy. Not used in this design: shown with its tokens for comparison. Give the section root data-pattern="nav.seventies-rounded-tab". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
The whole nav is one floating capsule on the surface colour: wordmark left, plain links in the middle, a small primary button right.
Slots
siteName, pages, cta
Tokens
bg #F7E8C6 · text #3A1D0C · heading #4A1F08 · accent #D2561E · accent2 #BF8400 · Shrikhand / Nunito · radius 32px · space unit 8px (full list in design/tokens.json)
Section
vertical padding step 2

Pattern notes

  • The whole nav is a single floating capsule on `surface` with the `radius` rounding at full: wordmark on the left, plain links in the middle, a small primary capsule button on the right.
Northfold
  • Services
  • Work
  • About
  • Contact
Start a project