Shader Image Slider

An image slider whose transitions are drawn on the GPU: one picture melts, burns, ripples, glitches or is struck by lightning into the next, with WebGPU, or WebGL 2 where there is none. Drag it, press the arrows or the dots, use the keys, or let it play by itself.

Features

• Five shader transitions: Liquid, Burn, Ripple, Glitch, Lightning, and a plain Fade

• A picker on it, if you like: buttons that let visitors try the transitions

• Your own images from Framer's picker; empty, it shows four to try it with

• Autoplay that waits while the pointer is over it; loop, duration, arrows, dots

• Fill or Fit, corner radius, background, a label for screen readers

• Fills its frame at any size and breakpoint; drag and swipe on phones

• Nothing of ours on your site: no badge, no link

Built on gpu slider, with 24 transitions for your own code: gpuslider.com