Strange bug on Chrome with backdrop-filter blur
Problem: unexpected behavior on Chrome with Windows zoom setting to 125% or more, all fine with 100%, it stop bluring in the bottom half of the screen, what could it be?
https://codepen.io/Giusto-the-typescripter/full/rNRPavJ
14 Replies
i can not reproduce it. You have a screenshot
Sure give me a sec
As you can see in the second pic the bottom part is not blurred, also if a reduce the window size the same is for the right side, to reproduce you might need to change the Windows settings and put the zoom to 125% or more
Windows as OS not as Chrome window
yea, i tried that, but still it looks okay. maybe wait for other people to see this post
which resolution do you have on your monitor?
ok thanks, which version of chrome are you using?
121.0
ok thank you for your time!
hey, i'm on windows 11 with chrome 121 and getting the buggy (non blurred) behavior even at 100% zoom. This seems like it might be a GPU related thing? Might be worth filling a chrome bug? Looks like lots of issues with
backdrop-filter
rendering: https://issues.chromium.org/issues?q=backdrop-filter%20
maybe try <canvas>
instead of with CSS?thank you for your answer, yeah i was thinking to fill a chrome bug but i'm scared that I don't know enough to look serious, you know i dont wanna be "that guy"
i'll give it a try
only other thought i had was it looks like you're animating
top
and left
I wonder if transform:translate
might get around the issueMmh I don't think, I'm animating blob not blur