About DistortionSlider
An infinite vertical image slider rendered entirely on canvas, with a signature wave-distortion effect that reacts to scroll velocity and direction. Slides loop seamlessly, scale toward center, and ripple apart in real time as you scroll, drag, or swipe — no lag, no jank.
Click any centered slide to open a full-screen view with a particle dispersion animation: the image shatters into fragments that fly outward on open and reassemble smoothly on close.
Best for:
Portfolio and photography sites needing a bold, motion-driven hero or gallery section
Fashion, editorial, or agency landing pages wanting a tactile, physical feel to image browsing
Any full-bleed section where scroll-reactive visuals should carry the page's personality
How to use:
Drop the component into a full-screen or fixed-height frame
Add your slides in the Slides array — each with a title and image
Choose a background type (solid, linear, radial, conic) and style the title/count overlay
Tune Distortion, Wheel/Drag/Touch Speed, and Center/Edge Scale to dial in the feel you want
Adjust Min/Max Height and Seed to change the randomized slide rhythm
Set Particles to control the density of the click-to-expand dispersion effect
Refund Policy: All sales are final — no refunds are offered on this component.
