Motion.library

Displace

Hovering pushes a ripple through the card artwork via a displacement field that relaxes back to rest — a shader-style effect on 2D canvas.

cards / card-image-ripple
Playback
Complexity
Advanced
Interaction
Cursor, Hover
Stack
Canvas
Category
cards

Where to use it

PortfolioExperimental

Ships as motions/cards/card-image-ripple.tsx — a self-contained component that accepts playing, speed, params and respects reduced-motion.

Related motions