Googly Eyed Button
The Magnetic Googly-Eye Button is an interactive Framer component designed to add personality and subtle delight to your interface through motion and cursor-aware behavior.
As the user moves their cursor or touch point near the button, the component gently shifts toward it, creating a magnetic effect. At the same time, the googly eyes follow the cursor in real time, reinforcing interaction and visual feedback. On hover, the eyes scale up slightly, making the interaction feel responsive and expressive without becoming distracting.
The component is fully customizable via Framer’s property panel. You can easily adjust:
Magnetic pull strength and responsiveness
Eye size and hover scaling behavior
Motion speed and easing
Button text, colors, size, and typography
Built to be lightweight, responsive, and easy to integrate, this component works across breakpoints and adapts well to different layouts. It’s ideal for call-to-action buttons, hero sections, creative portfolios, playful brand sites, and experimental landing pages where interaction and character matter.
No code required. Simply drop it into your project and customize it to fit your design.
Martina Gazenova
