Just a heads up to anyone who might be struggling with this, but the backdrop blur setting in the Filters section of the Inspector for all the menu components doesn’t appear to work in Safari (v18.6 here). However, it works in the Elements editor and it works if I use Chrome for preview.
It’s not a bug in Elements - the correct tailwind classes are generated, as evidenced by the behaviour in Chrome. If anyone is using a different version of Safari and it works for you please let us know!
Is this what you mean for the menu? Both Safari 26 and Tech Preview Release 227
Here’s what I see:
It’s a bit difficult to tell with the level of opacity in your menu bar, but there’s no blur. If Safari 26 is ok, then no sweat. I’m stuck on Ventura (for other software compatibility reasons!) - hence the old-ish (but still supported and updated) Safari that I’m using.
So, 18.6 is the latest stable version of Safari on MacOS (at least until the last few days when 26 came out across all platforms as part of the big rebrand).
Argh, I read your post as transparency. However I have set a blur and it works, Need a refresh in the browser.
Use https:// - I get a warning that the website may be fraudulent.
Not sure what’s happened now but this is what it looks like:
No opacity, no blur!
I’m beginning to wonder if my Safari is broken…
Now fixed. I thought I had enabled & forced https
Background blur is working, I’m wondering if you have the wrong setting enabled…
If you share your project here (via Elements Cloud) we can take a look for you.
Hey @dan, not sure whether your comment was aimed at me or Russ… To clarify, backdrop blur is working for me in Elements - the difference I’m seeing is that when previewed in Safari (18.6) it has no effect, whereas in Chrome it works. Also, Russ’s website menu is blurring for me in Chrome, but not in Safari.
Can anyone else try Safari 18.6 with Russ’s site and see whether it’s just my Safari that’s misbehaving or whether it’s a general Safari issue?
Works finde for me and Safari 18.6:
No Safari extensions enabled, but I am on Intel (2020 MacBook Pro) and still running Ventura for various applications’ backwards compatibility reasons.
I think there are some things Safari on Intel could not support, but I might be wrong here.
Ok - I got to the bottom of it 
With the “Develop” menu visible (set “Show features for web developers” in the Settings Advanced tab) there are a number of feature flags available. There’s a whole bunch of disabled CSS features identified as either “Preview” or “Testable”. One of the latter category is “CSS Unprefixed Backdrop Filter”. If I turn this on, background blurs render correctly.
It sounds as though this feature is now turned on by default in the recently released Safari 26. However, there will be a lot of earlier versions out there for a while, so beware when using background blurs that some users might not get to appreciate some of the subtleties of your page design!
Thanks for finding that, it was also driving me crazy that Safari was not rendering blur while every other browser was.
