Fifty navbars. One unmistakable taste.
A curated showcase of 50 unique navigation concepts — 20 solid-surface, 10 transparent hero overlays, 10 shaped-border navs, and 10 pendant navs (semicircle, trapezoid, jewel, teardrop, orb, crown). Each one is engineered with motion and a premium tone.
Crystal Glass Pill
Floating frosted-glass pill with a polished inner shadow and gradient CTA.
Magnetic Pill Slider
A morphing gradient pill glides to the link the cursor hovers — silky and intentional.
Underline Sweep
Minimal editorial nav with a gradient underline that sweeps in from the center.
Onyx & Gold
A luxury, jewellery-grade aesthetic — onyx black with champagne-gold accents.
Mega Menu Reveal
A wide, content-rich panel unfolds on hover — perfect for service-heavy brands.
Center-Split Logo
Symmetric, magazine-cover composition with the wordmark anchored in the center.
Marquee Ticker + Nav
A premium announcement ribbon scrolls above a clean executive-style navbar.
Side Rail Expand
A persistent vertical rail that elegantly expands on hover for app-shell layouts.
Hover the rail to expand. A persistent side navigation for app shells & dashboards.
Floating Dock
A macOS-inspired dock with icon magnification and ambient glassmorphism.
Diagonal Slash
Angular, parallelogram-cut links with a directional gradient sweep on hover.
Animated Gradient Border
A conic-gradient halo rotates around each link as the cursor lingers.
Spotlight Follow
A soft cursor spotlight glides across the bar — futuristic and product-led.
Command Palette
Developer-grade UX: a global ⌘K search button is the centerpiece of the navbar.
Editorial Serif
Centered, small-caps wordmark with whisper-thin dividers — magazine elegance.
Spring Pill
Each link is hugged by a gradient pill that springs into place — playful & premium.
Numbered Index
Each link is paired with a monospaced index — a quiet nod to portfolio aesthetics.
Reveal Subtitle
A whispered tagline drops in beneath each link on hover — discoverable depth.
Floating Bottom Pill
An app-shell bottom-bar in a phone-style canvas — modern, tactile, thumb-friendly.
Mobile-first floating bottom nav
Always in reach
Thumb-friendly, beautifully decoupled from the page.
Glow Orb Indicator
A neon orb crowns each hovered link with a soft, premium halo — dark mode delight.
Ink Wash Fill
Hovered links are flooded by a gradient wash from the top — couture and confident.
Hero Overlay Ghost
TransparentFully transparent nav sitting on top of a bold purple hero — pure type and motion.
Saturated Glass
TransparentTransparent body with backdrop-blur and saturate — punchy over a sunset hero.
Mix-Blend Difference
TransparentText uses blend-difference so it adapts perfectly across light and dark hero halves.
Hairline Beneath
TransparentA whisper-thin gradient hairline anchors a fully transparent nav on a mesh hero.
Edge-Fade Mask
TransparentA horizontal fade mask softens nav edges into the hero — couture transparency.
Aurora Sky
TransparentTransparent nav floats over an animated aurora gradient — luminous and futuristic.
Starfield Night
TransparentTransparent nav over a deep cosmos backdrop — small stars sparkle on hover.
Glass Pill Over Photo
TransparentA compact, fully glass pill floats on a vibrant hero scene — invite-only premium feel.
Floating Hero Wordmark
TransparentTop-centered logo and transparent items — for landing pages with a big hero moment.
Soft Sky Hero
TransparentTransparent nav over a pastel sky — quiet, modern, and unmistakably high-end.
Double Scallop Banner
ShapedA solid-white nav with two graceful scallops on the bottom edge — banner-couture.
Sine Wave Bottom
ShapedContinuous, hand-drawn sine wave on the bottom — playful yet refined.
Hanging Logo Tab
ShapedA pedestal tab drops from the center cradling the wordmark — emblematic and bold.
Concave Arch
ShapedAn onyx bar with a single wide concave arch — architectural and minimal.
Convex Pendant
ShapedThe bottom-center bulges into a soft pendant — couture confidence over rich purple.
Ribbon V-Notches
ShapedTwo V-cuts at the ends evoke a ceremonial ribbon — premium with a celebratory edge.
Crenellated Teeth
ShapedCastle-like battlements line the bottom — bold, structured, unmistakable.
Triangle Pennants
ShapedA row of downward pennants — festive bunting energy with a gradient ribbon body.
Active Tab Drop
ShapedA single tab protrudes from the bottom under the active link — clear, premium IA.
Cathedral Arches
ShapedSix connected arches in onyx + gold — a heritage, jewellery-counter aesthetic.
Semicircle Pendant
PendantA smooth half-circle cradles the wordmark beneath the nav — a logo-pedestal moment.
Trapezoidal Pedestal
PendantAn angled trapezoid pedestal hangs below — architectural, museum-plaque elegance.
Rounded Tab Drop
PendantA pill-shaped tab drops beneath the bar to cradle the wordmark — soft and modern.
Inverted V Spear
PendantA precise V-spear drops from the center — directional, sharp, and unmistakably bold.
Hex Jewel Pendant
PendantA jewel-cut hexagonal pendant in onyx and gold — bespoke and high-jewellery.
Teardrop Pendant
PendantA soft teardrop pendant — fashion-forward couture with a rose-blush palette.
Glow Orb Pendant
PendantA pill pendant holds a pulsing brand orb — premium app-shell vibes.
Tiered Pedestal
PendantA two-step staircase pendant in violet gradient — structural and confident.
Wide Plateau Banner
PendantA broad rounded plateau hangs beneath the bar — ideal for a hero tagline.
Crowned Pendant
PendantA regal pendant with a small triangular peak — the centerpiece of a flagship hero.
Have a favorite?
These concepts are designed to be drop-in. Tell us the number you like and we'll wire it up to the live site with your real routes, branding, and CTAs.
Pick a navbar
