如何在前端实现 iOS 26 的液态玻璃（Liquid Glass）样式？

[tsja]

如题，之前的扁平、毛玻璃、半拟物的风格都能通过设置背景色、阴影和高光实现，但这次液态玻璃就涉及到了光影、反射和透视的关系了。在前端中有什么可以实现的方式？

[BingoXuan]

整个界面用 webgpu 重写吧。我看了 wwdc 总结唯一想法就是，真的难为实现设计师效果的那帮工程师了，估计写 metal shader 写到想哭（最近自己也在手写 metal shader ，我也想哭）

[b821025551b]

https://github.com/lucasromerodb/liquid-glass-effect-macos

[b821025551b]

@b821025551b 这个效果不错，但是资源占用太高了，3080 占用 15%。

[search1615]

@b821025551b #3 资源占用确实很高

[iMusic]

我看推特上已经有人实现了，应该是用 SVG 滤镜。不过还没放源码吧

[HeyWeGo]

@b821025551b #2 这效果看了有点眼晕

[chztv]

@b821025551b 这个没有实现按钮拖动切换时的效果

[BigPiggggg]

https://codepen.io/9am/pen/eYbaQBw