▌ GitHub radar
Liquid Glass for the Web: Apple Effect in React
A zero-dependency React component that brings Apple's Liquid Glass effect to the browser — as a live lens that refracts actual DOM content, not a frozen screenshot overlay. Text stays selectable, links stay clickable, and it works across Chrome, Firefox, and Safari including iOS.
Liquid Glass is a zero-dependency React component that recreates Apple's signature glass morphism effect for the web — not as a frozen screenshot overlay, but as a live lens refracting actual DOM content underneath. The implementation uses SVG displacement filters with signed-distance field rasterization to produce chromatic aberration and refraction while keeping all underlying elements fully interactive. It works across Chrome, Firefox, and Safari including iOS, and supports three modes: in-place refraction of child elements, separate content refraction via a prop, and WebGL rendering for video and canvas.
Why a vibe-coder should care
If you're building a landing page, portfolio, or app and want that polished Apple glass look — this is how you do it properly without breaking your UI. Until now, getting this effect cross-browser meant either it only worked in Chrome or the content underneath froze; this component solves both problems at once, making it a practical drop-in for any React project.
More finds