Mouse Follow

Four cursor-following effects built on Framer Motion springs — from a direct 1:1 tracker to physics-based blobs and a link-hover image swap.

Installation

Terminal
npx gotlui add mouse-follow

Usage

page.tsx
import {
  SimpleMouseFollow,
  SpringMouseFollow,
  VelocityStretchMouseFollow,
  LinkHoverImageCursor,
} from "@/components/gotlui/mouse-follow"

// Native cursor everywhere, except hovering a link/button —
// then this image follows the pointer instead:
<LinkHoverImageCursor src="/cursors/lip-bite.png" size={120} />

All variants

SimpleMouseFollow

A dot that tracks the pointer directly, no easing.

SpringMouseFollow

Tracks the pointer through a spring, with fade + scale in on hover.

VelocityStretchMouseFollow

Stretches and squashes along its direction of travel based on real pointer velocity — a liquid blob feel.

LinkHoverImageCursor

Leaves the native cursor alone everywhere — except while hovering a link or button, where it hides the cursor and your image (or GIF) follows the pointer instead.

Hover this link

SimpleMouseFollow and SpringMouseFollow adapted from Skiper UI (Skiper 61) by Gurvinder Singh, used under its free-tier license. VelocityStretchMouseFollow and LinkHoverImageCursor are original.