DEV Community

loading...

Discussion on: Backdrop Filter effect with CSS

Collapse
jasonli9933 profile image
JasonLi-9933

Thanks for the sharing! The feature can be enabled in Firefox by setting the layout.css.backdrop-filter.enabled to true in about:config. For more info check out the caniuse.com/#search=backdrop-filter

Collapse
urielbitton profile image
Uriel Bitton Author

Nice thanks for that!

Collapse
shadowscientist profile image
Shadow Scientist

Thanks for the reply. I've already enabled it in Firefox 79 but still no luck, I don't see the backdrop, only the fallback of background:rgba(0,0,0,0.1). Here is a snapshot:

about:config
Backdrop filter in Firefox

I updated Chrome to v84 and did the same test and it works!

Backdrop filter in Chrome

Not sure what's wrong in Firefox.

Thread Thread
urielbitton profile image
Uriel Bitton Author

I think after some research that firefox doesn't have compatility unfortunately.

Thread Thread
shadowscientist profile image
Shadow Scientist

No worries, we've -moz-element! 😄

Thread Thread
simevidas profile image
Šime Vidas

FWIW, it works in Firefox Nightly after enabling that flag.

Thread Thread
urielbitton profile image
Uriel Bitton Author

Nice!

Thread Thread
scheinercc profile image
Al