Skip to content

Googly Eyed Button

A playful CTA with tracking eyes

Googly Eyed Button preview image 1

Summary

A playful CTA with cursor-tracking eyes

Description

Full Description

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.

Rank history How rankings work →

125015001750189928/149/59/2710/1911/11
  • All · #8052

Details

More like this