Morph Slider
An image slider that melts from one picture to the next with a WebGL2 displacement transition.
import { MorphSlider } from "pleate/effects/morph-slider";Landscapes
Slide 1 of 4: A mountain lake at sunrise
Props
- slides
Images (must allow CORS).
{ src, alt }[]- duration
Transition (ms).
numberdefault 1200- strength
Melt strength.
numberdefault 0.2- autoplay
Advance every N ms; 0 is off.
numberdefault 0
Accessibility
- A carousel region with prev, next and dot buttons; left and right arrows work inside it.
- The current slide is announced politely; autoplay pauses on hover and focus.
- Without WebGL2 or with reduced motion it crossfades plain images.