Animated Cursor

Ditch the default cursor and replace it with something custom. This system lets you swap the boring arrow for any element—a dot, a ring, emoji, whatever. CursorFollow adds that smooth, lagging trail effect with spring physics. You can have multiple followers orbiting at different positions (top, bottom-right, etc.). The native cursor hides when you enter the container and comes back when you leave. Great for creative portfolios, agency sites, or anywhere the default cursor feels too plain.

Installation

npx shadcn@latest add https://www.shadcn.io/r/animated-cursor.json

npx shadcn@latest add https://www.shadcn.io/r/animated-cursor.json

pnpm dlx shadcn@latest add https://www.shadcn.io/r/animated-cursor.json

bunx shadcn@latest add https://www.shadcn.io/r/animated-cursor.json

Related Components

FAQ