Decay Card

Description:

The DecayCard component is a modern, interactive card built with React, GSAP, and SVG filters to create a dynamic displacement and turbulence effect that reacts to mouse movement.

As users move their cursor across the screen, the image smoothly warps, rotates, and distorts, simulating a “decaying” or melting visual effect. This is achieved using:

• 🌀 SVG Filters (<feTurbulence> + <feDisplacementMap>) for the distortion texture.

• ⚡ GSAP animations for real-time motion control and performance-optimized updates.

• 🧭 Lerping (linear interpolation) to create smooth transitions between cursor states.

• 💡 Responsive transformations that give the illusion of depth and organic motion.

This component is perfect for creative portfolios, hero sections, or experimental UIs — adding a sense of fluidity and interactivity to static images.