Skip to content

component

Figma Cursor

By Aviral Lakhanpaul

Details

Summary

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

Description

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 Copy and paste the component into your project. Place it in your primary breakpoint. Change Type to Fixed and pin it to the top of the page. Set Width to Relative 100% and Height to Viewport 100vh. 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.

Introduction

Smooth and fun cursor with chip

Rank history

Daily rank per list, from the first snapshot — lower is better.

110012001300132538/148/228/309/79/15
  • All · #1368