Liquid Glass
2025
A clean glassmorphism-style message layout with subtle blur, brightness, and saturation effects using just HTML and CSS. Features a soft frosted-glass
Elena Lanot now
CB's 45th 🎉🎈
Hey all! We're so excited to see you on Saturday. Reminder that if you're planning to drive, please let me know ahead of time so I can get you a temporary parking per...
Shred Heads now
Trev Smith
Was just listening to that record the other day, such an epic era! Still BUMMED I never got to see them play it live...
To recreate the iOS 26 “Liquid Glass” effect, I used a combination of
CSS layering and filters. The core trick lies in the
:after
pseudo-element, which sits behind the content using position: absolute
and z-index: -1
, applying a subtle backdrop-filter: blur(4px)
along with saturation and brightness tweaks to simulate frosted
distortion. I wrapped the container with
isolation: isolate
to keep the effect scoped, and used overflow: hidden
to ensure a clean edge. No JavaScript or extra libraries, just pure
CSS doing all the heavy lifting.