Navigation bar
Brand left, 4 links right, burger menu on mobile. Classic horizontal nav.
nav/default/default
Navigation bar templates
Top navigation patterns: brand with links, centered menus, minimal brand-plus-CTA bars and muted band variants. Every nav collapses to a burger on mobile and stays consistent with the rest of the catalog.
8 variants · neutral wireframe · ready to reskin with your design tokens
Navigation barNavigation with CTANavigation with two CTAsNavigation with dropdown hintsCentered navigationCompact centered navMinimal navigationMinimal nav (muted band)
Navigation with CTA
Brand left, 4 links, primary button on right. Good for signups or trial CTAs.
nav/default/with-cta
Navigation with two CTAs
Brand left, 3 links, secondary + primary button on right. Dual-path routing.
nav/default/with-double-cta
Navigation with dropdown hints
Brand left, 3 dropdown-capable links with chevrons, CTA right. Signals nested menus.
nav/default/with-dropdown-hint
Centered navigation
Brand left, 4 links centered, CTA right. Balanced layout for content-heavy sites.
nav/centered/default
Compact centered nav
Brand left, 3 links centered, secondary link right. Smaller footprint variant.
nav/centered/compact
Minimal navigation
Brand left, single CTA right, no links. Distraction-free, fits tight spaces.
nav/minimal/default
Minimal nav (muted band)
Brand left, 3 links and CTA right on a light muted band. Distinguishes the nav from the page without going dark.
nav/minimal/muted
claude mcp add --transport http rifframe https://rifframe.app/api/mcp > "Add a navigation section to my landing page"
Your coding agent can search and pull these sections directly. How it works.