Next-level frosted glass with backdrop-filter
joshwcomeau.com
Next-level frosted glass with backdrop-filter
1–10 of 67 posts
Re: Next-level frosted glass with backdrop-filter
#2This always bugged me! The whole point of frosted glass is to be smooth and relaxing, but the lack of surrounding pixel data causes the blurred image to make unnatural jumps in brightness and color when just a single row of pixels scrolls into view.
It makes me very happy that someone not only noticed this, but did something about it, and then shared it freely!
Re: Next-level frosted glass with backdrop-filter
#3I like the fonts used on this blog!
Re: Next-level frosted glass with backdrop-filter
#4Very clever and it does result in a nice effect. I do have to say that I am a fan of this glassmorphism trend.
Re: Next-level frosted glass with backdrop-filter
#5Beautiful
Re: Next-level frosted glass with backdrop-filter
#6You can do it with negative margins too, https://codepen.io/webstrand/pen/OPLLBZN
Re: Next-level frosted glass with backdrop-filter
#7How does this compare with this that was posted on HN a few weeks ago?
Re: Next-level frosted glass with backdrop-filter
#8You can do it with negative margins too, https://codepen.io/webstrand/pen/OPLLBZN
Wait is this better than the one in the OP?
Re: Next-level frosted glass with backdrop-filter
#9I like the fonts used on this blog!
Same! The cursive font is Cartograph CF.
I thought at first it may have been (one of the) Playwrite fonts.
Re: Next-level frosted glass with backdrop-filter
#10The technique is interesting, but every time I see this effect, I can't help but feel like 2010 is calling and wants its UI design back.