News for hackers. Stuff that matters.
Re:Show HN: CSS generator for a high-def glass effect by mbforbes on Wednesday July 02, 2025 @12:49PM (#44445939)
Really nicely done! It's always surprising to me how often computer graphics isn't "one weird trick" and more like "5 layered tricks." Doing it with cross-browser compat is an additional challenge.

Do you have a sense of which aspects are the most resource-intensive? Naively I would guess it's the backdrop-filter.

Re:Show HN: CSS generator for a high-def glass effect by kris-kay on Wednesday July 02, 2025 @02:16PM (#44447064)
Yes, same! I didn't expect it to need so many tricks to implement. Your intuition is correct, the most resource-intensive part is the blur bit of the backdrop-filter. The higher the blur value, the more neighbouring pixels need to be "consulted" before rendering. Another resource-intensive aspect is continuous repaint as you scroll or as a video background changes the look of the glass.
Re:Show HN: CSS generator for a high-def glass effect by whycome on Wednesday July 02, 2025 @09:03PM (#44450554)
And sometimes it's 5 layered tricks just to "center" something.
Re:Show HN: CSS generator for a high-def glass effect by kris-kay on Wednesday July 02, 2025 @09:23PM (#44450668)
Not anymore! We live in the golden age of display: grid; + place-items: center;