Keyboard shortcuts

Press or to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

Fluid Surface

Combines @flow GPU shaders with pointer-query CSS-driven interaction. A central card renders a pointer-reactive fluid shader, while surrounding labels respond to cursor proximity via calc(env(pointer-distance)).

Tip: Some demos are best viewed in a full browser window. Click “Open in a new tab” below for the full experience.

Open in a new tab · View source on GitHub