Create interactive buttons that magnetically follow your cursor with smooth, physics-based motion. Choose from 4 pre-styled presets or connect your own custom component to add the magnetic effect.
Physics-Based Motion
Smooth, natural cursor-following with customizable magnetic strength and smoothness.
4 Button Presets
Rounded Rectangle, Circle Fill, Pill Fill, and Circle Outline styles ready to use.
Custom Component Support
Connect any Framer component to make it magnetic - icons, cards, or complex designs.
Text Counter-Movement
Adds depth by moving text in the opposite direction of the button.
Call-to-Action Buttons — Make CTAs more engaging and interactive.
Navigation Elements — Create memorable navigation experiences.
Portfolio Showcases — Highlight clickable elements with magnetic effects.
Landing Pages — Add premium interactivity to key conversion points.
- Default: Use pre-styled button presets
- Custom: Connect your own Framer component
- Magnetic Strength: How strongly the button follows cursor (0-1)
- Distance Threshold: Activation range for the effect
- Smoothness: Animation fluidity (lower = smoother)
- Text Counter Move: Depth effect intensity
Each preset has full customization for dimensions, typography, colors, and hover states.
Strength Settings — Start with 0.3 for subtle effect. Use 0.5-0.8 for more dramatic following.
Smoothness — Values around 0.1 provide the best balance of responsiveness and fluidity.
Custom Mode — When connecting custom components, ensure they have visible boundaries for best effect.
Hover States — Customize hover colors to provide clear feedback when the magnetic effect activates.
Single Use License — Use in one client project with full commercial rights. No redistribution. 1 license = 1 client.
Due to the nature of our digital products, we are unable to offer refunds, but we're here to assist you with any questions or concerns!
Why Designers Love This
Turn ordinary buttons into engaging interactive elements. The magnetic effect adds a layer of polish and interactivity that users remember, making your interface feel premium and alive.
FramerHub.io 
