component
DistortionSlider
By Talha Manzoor

Details
- Talha ManzoorAuthor
- componentType
- $6.00Price
- 2026-07-27Published
- 2026-07-28Updated
- 2026-07-27Added
- CarouselsCategories
Summary
Distortion-wave canvas slider
Description
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.
Introduction
Distortion-wave canvas slider
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #7115