Skip to content
Smooothy: A Slider Built to Sit Under Your WebGL Scene

Smooothy: A Slider Built to Sit Under Your WebGL Scene

Federico Valla's Smooothy is a tiny TypeScript slider that exists because every other carousel synced badly with WebGL. Drag through Toast and Fish but no Head while current, target, and parallaxValues tick out in real time, ready to feed your shader uniforms.

Details

Published

What it is

Federico Valla's Smooothy is, technically, a carousel library. The demo page gives this away by making you scroll through Toast, Fish but no Head, Hotdog, Ramen Bowl, and Just a Fungus, all priced at 33.23¥.

Smooothy is built to be the carousel underneath your scene, not over it. The Core class is a few hundred lines of TypeScript that exposes everything a shader actually cares about (current, target, progress, speed, parallaxValues, deltaTime) through an onUpdate callback you wire into your own RAF loop.

Worth the click for the configurable demo alone. Drag it around, hit the source code to see how the parallax values get piped into the actual GLSL.

How it’s made

Technology
WebGLGLSL
Technique
Shaders