DEV Community

Discussion on: Recreating Apple's Liquid Glass Effect with Pure CSS ✨

Collapse
 
shahriyardx profile image
Md Shahriyar Alam

What you made is not something new. You can see in apples liquid glass design the lights actually bend like in a real glass. Along the borders. But in your case it just a blur

Collapse
 
kevinbism profile image
Kevin Ramirez

At the moment, unfortunately, it's not possible to fully replicate the distortion using just CSS. There are other projects that manage to reproduce Apple’s effect quite well — there's an amazing one in the comments — but they have very limited support on some browsers. I tried to get as close as possible while keeping broad browser support.

Collapse
 
xeller profile image
Ryan

In the recent Telegram update for example. They perfectly reproduced this effect !!🤩

Collapse
 
xeller profile image
Ryan

You're right but for a beggining it's quite plausible

Some comments have been hidden by the post's author - find out more