Glass · Lab
Real refraction, not blur.
These four demos bend the image behind each control. A displacement map handles the lens shape. A copied backdrop keeps the effect working in Chromium, Safari, and Firefox.
Built after studying Aave, Outpace Studios, samasante/liquid-glass, and
Apple's iOS 26 reference images. Respects prefers-reduced-transparency.
Refraction playground
Drag the lens across the grid and watch straight lines bow at the rim. Adjust the strength, curvature, color split, and lens shape.
Traveling selection lens
One lens moves between navigation items and bends the photo behind it. Try Home, Library, and Settings.
Control-center slider
The slider thumb acts as a small lens. Drag it to see the track and photo bend underneath.
Call-button cluster
Four circular controls refract the photo. Mute and End add color without hiding the glass. Motion is reduced when the system setting asks for it.