Slopless Design

nav.desktop-menu-bar · Desktop menu bar

A nav pattern from Desktop OS, 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.desktop-menu-bar". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule

A slim OS menu bar across the page: boxed logo and plain menu links left, a mono clock-style meta and a small bevel primary button right.

Slots

siteName, pages, hours, cta

Tokens

bg #E3E5DA · text #272921 · heading #121309 · accent #EDA12F · accent2 #55A9FF · Onest / Onest · radius 8px · space unit 4px (full list in design/tokens.json)

Section

vertical padding step 2

Pattern notes

One slim surface strip (8 × 16 px padding, radius 8, 1 px rule, bevel edge): boxed logo and plain menu links on the left, a mono clock-style meta such as opening hours (hidden on phones) and a small primary key on the right.

Northfold

Services
Work
About
Contact

Studio open Mon–Thu, 9:30–18:00

Start a project