MorphSlider

Slider WebGL que funde imágenes con una transición líquida.

Cómo instalarlo

npx shadcn@latest add https://reactbits.dev/r/MorphSlider-TS-TW

Sustituyen a un componente estándar cuando la experiencia es parte del producto.

Prop	Tipo	Por defecto
items	Array<{ image: string; caption?: string }>	[...]
startIndex	number	0
transition	"melt" \| "ripple" \| "shear" \| "swirl"	"melt"
duration	number	1.1
ease	string	"power2.inOut"
intensity	number	0.55
scale	number	2.4
aberration	number	0.35
drift	number	0.4
autoplay	boolean	false
autoplayDelay	number	4
loop	boolean	true
radius	number	16
overlayColor	string	"#000000"
showCaptions	boolean	true
showControls	boolean	true
showIndicators	boolean	true
className	string	""

ProfileCard — Tarjeta de perfil holográfica con inclinación 3D.
Stack — Pila de fotos arrastrable con autoplay.
AccordionGallery — Paneles que se expanden al hover revelando imágenes con parallax.
BounceCards — Abanico de tarjetas que entran rebotando.
Carousel — Carrusel responsive con gestos táctiles y bucle.
CurvedInput — Campo de texto curvado con botón de envío.