Liquid Metal Navbar

About Liquid Metal Navbar is a responsive Framer navigation bar with flowing chrome borders and reflections that react to your cursor.

About Liquid Metal Navbar is a responsive Framer navigation bar with flowing chrome borders and reflections that react to your cursor. Its pill-shaped header combines four links, rolling text hovers, an optional logo and a CTA. Light and dark variants cover desktop, tablet and phone, with an expanding two-column mobile menu. Keyboard controls and reduced-motion support are included. What you can customize Native Framer layouts combine with code-powered metal effects. Customize links, labels, new-tab settings, CTA text, visibility, colors and key material settings through property controls. Edit typography and spacing on the canvas; nested controls adjust the logo, chrome palette, glow, reflections and motion. Light colors are editable in their variants. Includes a CSS fallback for WebGL. No code editing needed. Great for (examples) Just a few ideas, use it anywhere a compact header with a chrome finish fits your brand: Designer portfolios and personal websites Creative agencies, studios and freelancer sites SaaS, AI tools and app landing pages Hardware, automotive and technology showcases Fashion, jewelry and luxury brand websites Music releases, gaming and experimental projects Product launches, campaigns and waitlist pages Minimal websites with four-link navigation Share your build If you ship something cool with it, post it on X and tag me @Matthias_Oel , or send it over. I’d love to see what you create. Need help? Questions or feedback? Reach me anytime: matthias@lmvision.de or on X @Matthias_Oel. Need a matching component? Pair it with Liquid Metal Button+ or Liquid Glass Nav Pro . Explore all components →

Reflections that follow your lead