Magnetic Cards

Magnetic Cards for Framer.

Magnetic Cards Turn a simple card grid into a responsive, interactive experience with Magnetic Cards for Framer. Each card reacts naturally to the pointer, creating a magnetic pull that makes the entire grid feel tactile and alive. Cards can subtly translate, rotate, and scale toward the cursor, while an optional magnetic grid adds gentle repulsion between nearby cards for an even more dynamic interaction. Preview: https://magneticcards.framer.website/ Great for Portfolio projects Creative agency websites Designer portfolios Product showcases Case studies Team and profile sections Service cards Feature grids Digital products Interactive landing pages Experimental and motion-focused websites Features Magnetic Interaction Cards are attracted toward the pointer based on distance and configurable magnetic strength. The effect smoothly falls off as the pointer moves away. Spring-Based Motion Smooth spring and damping controls create natural movement instead of rigid or instant transformations. Position, Rotation & Scale Cards can translate toward the cursor while subtly rotating and scaling for a more tactile interaction. Customizable Magnetic Radius Control how far the pointer can influence cards, from a focused interaction to a large magnetic field. Multiple Activation Modes Choose between: Hover activate while the pointer is inside the component. Click toggle the magnetic interaction with a click or keyboard. Always keep the interaction active whenever the pointer is inside. Support X: @karimsaif https://x.com/karimsaif0 Email: karimsaif010@gmail.com I’m happy to help with setup, customization, bugs, or questions about using the component in your Framer project.

Cards can subtly translate,rotate