Real refraction — an SVG displacement map warping the backdrop, not a lazy blur. Drag the panel over the type and watch it bend.
Drag me
— the kit · every element is live glass —
⌕Search the docs…
Refraction
1
SVG filter
0
dependencies
How:backdrop-filter: url(#glass-liquid) — a feTurbulence→feDisplacementMap filter warps whatever's behind the element. Refraction renders in Chromium (Chrome/Edge/Arc); Safari & Firefox gracefully fall back to a frosted blur. One filter, zero libraries, fully reusable.