Recreating Liquid Glass Effects in the Browser with SVG and WebGL Shaders
Explore the evolution of recreating Apple's 'liquid glass' aesthetic in the browser. Discover how developers utilize SVG filters for faithful reproductions and WebGL shaders for dynamic effects like chromatic aberration and distortion.
Following Apple's introduction of the 'liquid glass' aesthetic, there was an initial surge of developers recreating this effect directly in the browser. As the novelty settled, more in-depth studies and refined implementations began to emerge.
Notably, Chris Feijoo leveraged SVG's advanced filtering capabilities to produce some of the most faithful and visually accurate liquid glass demos to date.
Concurrently, Chester Li explored the powerful potential of WebGL shaders, achieving unique effects such as chromatic aberration and dynamic distortion, pushing the boundaries of the liquid glass simulation.