Cursor Follow Button

About

This component creates an interactive button with an icon that smoothly rotates to follow your mouse cursor around the screen. The icon tracks the mouse position in real-time, creating an engaging and dynamic effect that responds to user movement.

This component a part of the 400+ components, layouts, templates, UI Kits and code overrides from SegmentUI PRO. Click here to see the full library

Instructions

1. Copy and paste the Mouse Follow Button component from into your Framer project file

2. Add a link in the "Link" field if you want the button to navigate somewhere (optional)

3. Toggle "Show Text" on if you want text alongside the icon, then customize the text content, position (left or right), colors, and font settings

4. Toggle "Show Icon" on (enabled by default) and paste your custom SVG code in the "Custom SVG" field, or leave it empty to use the default arrow icon

5. Customize the icon and text colors for both default and hover states, adjust icon size and gap between icon and text

6. Set your background colors for default and hover states, adjust padding, border radius, border, and shadow to match your design style

How It Works

The component comes with a fully customizable button that includes text and icon options. You can toggle the text and icon visibility on or off independently. The icon automatically rotates to follow your mouse cursor. In the properties panel, you'll find controls for Text (content, position, colors, and font), Background (default and hover colors), Icon (custom SVG, colors, size, and spacing), and styling options like padding, border radius, border, and shadow. You can also add a link that opens in the same tab or a new tab.

What You Get

When you purchase this component, you'll receive:

• The Component Itself - Full access to the component all future updates

• Remix File with Component Setup - A complete Remix file with the component pre-configured and ready to integrate into your project.

• Setup Instructions - Clear, step-by-step instructions to help you implement the component quickly and correctly.

• Dedicated Support - Direct access to our team for assistance if you encounter any issues during setup or implementation.

Support

For any queries and help setting up the component, contact hello@segmentui.com

Refund Policy

If a component does not function as advertised and the issue cannot be resolved, you are eligible for a full refund under our quality guarantee. Refunds will not be provided for any other reasons, including change of mind, accidental purchase, lack of use, or expectations of features not explicitly advertised.