How to use it: It’s incredibly simple. This acts as a "Wrapper" component. Just drag and drop it onto your Framer canvas, and connect the purple "Content" slot to any text, image, button, or card. It will instantly gain interactive physics!
Because you can connect it to absolutely anything on your canvas, the use cases are endless:
Magnetic Buttons: Create premium, Awwwards-style call-to-action buttons that gently pull toward the user's cursor when they hover nearby.
Playful Bento Boxes: Apply the "Push" force to grid items so they slightly dodge and tilt away when the user moves their mouse over them.
Interactive Portfolios: Make gallery thumbnails or project cover images pop out, scale up, and tumble in 3D as the mouse passes by.
Hero Images/Logos: Give your central graphic a sense of weight and floatiness that reacts instantly to cursor flicks.
🧲 Push & Pull Forces: Dial in the exact behavior. Make the element magnetically snap to the cursor, or act like a reverse-magnet that repels the mouse.
🚀 Velocity-Boosted Reactions: The physics engine calculates cursor speed. A slow mouse movement creates a gentle nudge, while a fast flick creates a massive 3D spin and push effect!
🧊 3D Tilt & 2D Spin: Elements physically tumble, twist, and rotate in 3D space as the invisible force field is breached.
⚙️ Advanced Spring Physics: Fine-tune the Mass, Stiffness, and Damping. Make your element feel like a heavy, sluggish bowling ball or a snappy, weightless feather.
📏 Custom Interaction Radius: You decide exactly how large the invisible "force field" around the element is.
🔗 Universal Slot System: Zero code required. Connect it to literally any existing layer or component in your Framer project.
monirul polash
