Fixed Menu

[johnhiggins]

Hi,

I’m using the Fixed Menu and it looks great.

I’ve been trying to add a blur to it so that when you scroll the content underneath it looks like frosted glass. When I try it blurs all the content in the menu.

Any way of blurring just the content underneath?

Thanks,

John

[ben]

You need to use Backdrop Blur, and also ensure your component has a semi-transparent background

[AndyG (Andy Greener)]

But beware, as I reported yesterday, Safari (v18.6) doesn’t render the blur, whereas Chrome does (haven’t tested any other browsers)

[johnhiggins]

As simple as that! Thanks Ben

[RussOggi255 (Russ Hore)]

I just checked and Safari 26 and Tech Preview 227 show the blur

[handshaper (Robin Mair)]

I have no problems with Safari showing a blur behind the menu.