Capability demo · not a client site

Liquid glass,
in the browser

SVG displacement maps, backdrop saturation, and a living mesh — vanilla HTML. No React build step.

Move your cursor here

Turbulence shifts · edges refract · panels breathe

01 — Panels

Three glass recipes

Soft frost

High blur, low displacement — readable content with a gentle melt at the rim.

blur 12 · scale 14

Fluid default

Balanced refraction inspired by React Bits fluid-glass — the sweet spot for UI chrome.

blur 18 · scale 28

Heavy liquid

Aggressive displacement + saturation — edges warp like molten glass over color.

blur 10 · scale 42

02 — Dock

macOS-style fluid dock

60fps target
0npm packages
SVGdisplacement
CSSbackdrop-filter

03 — Live tune

Drag to bend the glass

24
20
1.65

A

Chromatic mesh bleeds through heavy displacement at the corners.

B

Frost-first: less warp, more blur — typography stays crisp.