仿 Liquid Glass 的效果已经有人在 Web 上复刻出一部分了（非完全还原）

[gophlet]

只能在基于 Chromimum 内核的浏览器上才能看得到效果。

我挑了几个还原得比较像的，把链接放上来了，大家可以看看。

1 - 这个是我个人感觉最像的了

源码： https://codepen.io/Mikhail-Bespalov/pen/MYwrMNy

2 - 这个还原度差很多

源码： https://codesandbox.io/p/sandbox/nn5q2y

3 - 这个细节多一些，但是凸透镜效果也是不如第一个

预览： https://liquid-glass.maxrovensky.com/

仓库： https://github.com/rdev/liquid-glass-react

[gzlock]

@yokisama 19 楼的 flutter 网页用 shader 实现的，很流畅

[irrigate2554]

@yangheng4922 这个怕是比苹果官方都像玻璃。

[irrigate2554]

@make17better 求求了，这种东西还是别整成标准了，我设备性能不是用来干这个的。

[shui14]

自己搓一个 2d 光追

[Lshl56B4vDqdixwK]

哎，这种 UI 设计千万不要在 web 端普及，前端的噩梦，视障人士的噩梦。而且这种效果非常浪费资源，进一步加剧全球变暖。Apple, How dare you !?

[jqtmviyu]

我喜欢谷歌的 md 1/2 设计语言, 这种半透明/模糊的实在欣赏不来.

[gophlet]

@irrigate2554 哈哈哈😄，目前来看对性能的影响确实有点大，但说不定这在未来就不是问题了。

[gophlet]

@yangheng4922 这个很厉害啊，这个效果在移动端 Safari 上都很完美！👍

[gophlet]

@user23125 这套设计系统一点都不环保 🐶

[midraos]

看到一个用 shader 实现的 https://www.shadertoy.com/view/WccXDj

[2Broear]

连 backdrop-filter 都没弄明白，还弄这个

[gophlet]

@midraos 这个玻璃边缘的效果做得比较好。

[montaro2017]

@yangheng4922 #19 为什么拖到最右边会显示一块黑斑