Blur Navigation

About

Blur Navigation is a floating frosted-glass panel that expands from a compact top bar into a complete menu while blurring the entire page behind it. Its signature spotlight interaction keeps the hovered link sharp while surrounding rows blur and dim, complemented by staggered reveals, a morphing menu button, and a live clock.

What you can customize

The navigation and its interactions are built with native Framer elements and remain fully editable on the canvas. Customize the wordmark, menu rows, links, social profiles, clock, page blur, glass appearance, spacing, typography, animations, and default open state.

Great for (examples)

Just a few ideas, use it anywhere you want navigation to feel more focused and immersive:

• Creative agency websites

• Design studios

• Portfolio websites

• Photography portfolios

• Architecture firms

• Fashion brands

• Editorial websites

• Marketplace websites

• Product launches

• Hospitality websites

• SaaS landing pages

• Premium Framer templates

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.