Blocks/Navigation(54)

Navbar components and menus.

PRO

navbar58

Monogram Navbar

Minimal stacked navbar — a large primary logo square with the wordmark tucked into its corner, over a quiet ruled row of uppercase links. No buttons, no hamburger.

PRO

navbar57

Display Type Navbar

Typographic navbar where the links are the heroes — a hairline brand row above a full-width spread of giant index-numbered links closed by a primary arrow CTA, always visible with no hamburger.

PRO

navbar56

Giant Wordmark Navbar

Typographic statement navbar — a hairline row of index-numbered links and availability above a giant wordmark with a primary square, studio meta and seal CTA.

PRO

navbar55

Editorial Mega Menu Navbar

Navbar with an editorial split mega panel — eyebrow statement and seal CTA on the left, a numbered two-column project index in the middle and a tall studio image on the right.

PRO

navbar54

Multi Mega Menu Navbar

Navbar where multiple items each open their own mega panel — three eyebrow-titled columns of described links with a view-all footer strip.

PRO

navbar53

Dark Mega Menu Navbar

Dark studio navbar whose Services item opens a mega panel with three eyebrow-titled link columns and a bordered booking card with a seal CTA.

PRO

navbar52

Letterhead Navbar

Letterhead-style navbar with a stacked brand block beside stacked rows of location, email and links, closed off by a seal CTA on the right.

PRO

navbar51

Tab Bar Navbar

Two-row navbar with brand, availability status and seal CTA on top, and an underlined active-tab link row that scrolls horizontally on mobile.

PRO

navbar50

Floating Card Navbar

Detached floating navbar card with a square-mark wordmark, uppercase links and a compact seal CTA — the mobile menu unfolds inside the card.

PRO

navbar49

Drawer Navbar

Minimal navbar with an availability status whose menu opens a dark right-side drawer — numbered links float in with a stagger over a backdrop, with a seal CTA and socials below.

PRO

navbar48

Masthead Navbar

Print-inspired masthead navbar with a giant centered wordmark flanked by studio meta and contact, over a ruled row of spread-out links with an inline seal CTA.

PRO

navbar47

Mega Menu Navbar

Studio navbar whose Work item opens a full-width mega panel with category links and three featured project thumbnails.

PRO

navbar46

Submenu Navbar

Studio navbar with hover dropdown submenus on desktop, described sublinks, a seal CTA and an inline-expanded mobile menu.

PRO

navbar45

Fullscreen Overlay Navbar

Dark navbar with a hamburger menu cell that opens a fullscreen overlay — the panel and its centered links cascade down from the top, with a contact footer.

PRO

navbar44

Centered Logo Navbar

Symmetric navbar with links on the left, a square-mark wordmark centered and a seal CTA on the right, plus a tile-grid mobile menu.

PRO

navbar43

Dark Announcement Navbar

Dark studio navbar with a primary announcement bar, wordmark with tagline divider, uppercase links and a primary seal CTA.

PRO

navbar42

Grid Cell Navbar

Table-inspired navbar with full-height bordered link cells, an availability cell and a dark full-height seal CTA cell.

PRO

navbar41

Editorial Studio Navbar

Two-tier studio navbar with an availability utility strip, square-mark wordmark, index-numbered links and a seal CTA.

PRO

navbar40

Breadcrumb Navbar

Two-row navbar with main navigation and secondary breadcrumb bar for hierarchical content paths. Perfect for e-commerce product pages and documentation with deep category structures.

PRO

navbar39

Command Palette Navbar

Developer-focused navbar with Cmd+K command palette for keyboard-driven navigation and actions. Perfect for developer tools, documentation sites, and power-user applications.

PRO

navbar38

Dual-Row Navbar

Two-tier navbar with slim top bar for announcements and contact info above main navigation. Perfect for e-commerce and service businesses displaying promotions and support details.

PRO

navbar37

Floating Pill Navbar

Centered floating navbar with rounded pill shape, backdrop blur effect, and compact layout. Perfect for modern landing pages and portfolios wanting a minimal floating navigation style.

PRO

navbar36

Tab-Style Navbar

Navbar with tab-style navigation supporting underline or pill active states for app-like navigation. Perfect for dashboards and admin panels with section-based interfaces.

PRO

navbar35

Sliding Indicator Navbar

Responsive navbar with animated sliding underline indicator that follows hover and highlights active navigation item. Perfect for SaaS dashboards and apps wanting polished micro-interactions.

Markdown version