Figma Cursor

Perfect for portfolios, agency sites, and product pages.

Figma Cursor enhances user experience with fluid motion and subtle micro-interactions — no code.

Features

• Inspired by Figma’s iconic live cursor look

• Built with smooth motion physics for a natural follow feel

• Fully responsive and lightweight — optimised for performance

• Works on any layout or page setup

• Adds a premium interactive feel that instantly elevates your UI

Customisations

• Cursor - size, colour, border properties, and shadow properties

• Responsive Toggle — enable adaptive behaviour across devices

• Chip - text, font, colour, background colour, padding, radius, alignment, offset, stiffness and damping

Usage

1. Copy and paste the component into your project.

2. Place it in your primary breakpoint.

3. Change Type to Fixed and pin it to the top of the page.

4. Set Width to Relative 100% and Height to Viewport 100vh.

5. Done! You now have a Figma-style cursor with a smart floating chip.

NOTE: Keep the z-index of the component to a higher value (>1), but lower than the interactable elements in your web page, otherwise the cursor will not be able to detect them.

After completing your purchase, you will receive a link to the component.

Copy the URL and paste it into your Framer project to import it.