Interactive cursor and physics effects
These components answer the visitor directly: the pointer, a drag, a click. Image trails drop a sequence of photos behind the cursor, revealed through clip-paths. Spotlights and smudge revealers move a mask with the mouse to uncover a hidden layer. Physics pieces built with Matter.js let people throw, stack and drop elements under gravity, and particle logos scatter and reform around the cursor.
GSAP Flip powers layout switches that rearrange a whole collage in one move, and a tile board spins in 3D as the pointer passes. Click-driven pieces spawn images where you click or open a project overlay. Interactivity is memorable and easy to overdo: keep it to one hero or one section where play fits the brand, and give touch users an equivalent, because a cursor trail does nothing on a phone.
The examples
Other categories
- GSAP scroll animation examples
- GSAP menu animation examples
- GSAP slider and carousel examples
- GSAP hover effect examples
- GSAP text animation examples
- GSAP preloader examples
- Page transition examples: GSAP, Barba.js and View Transitions
- GSAP image gallery examples
- GSAP card animation examples
- Three.js and WebGL effect examples
- Animated footer examples