Transform static buttons and icons into playful, interactive elements. The Magnetic Interaction Effect adds a layer of "physical attraction" to your UI, making elements subtly follow the user's cursor when it gets close.
Used by top-tier creative brands, magnetic interactions provide immediate feedback to the user, making the interface feel responsive and alive. It’s particularly effective for navigation icons, floating buttons, or profile pictures.
Organic Movement: Uses easing functions to ensure the attraction feels natural, not mechanical.
Smart Radius: Only activates when the mouse is within a specific range, preventing unnecessary movements across the screen.
Performance Optimized: Uses CSS transforms and a lightweight event listener to maintain high frame rates.
Zero Layout Shift: The movement is visual only; it doesn't affect the surrounding elements or document flow.