Components/Effects

Image Trail

A very smooth and interactive trail of images that follows your mouse cursor with discrete step interpolation.

imagetrailmouseanimation

Preview

Wiggle your mouse around.

Installation

npx shadcn@latest add @grootstudio/image-trail

Usage

Props

PropTypeDefaultRequiredDescription
itemsstring[][]An array of image URLs to use in the trail.
distancenumber40The fraction of the window width required to trigger spawning a new image. Larger numbers mean closer images.
maxNumberOfImagesnumber5The maximum number of images that can be visible on the screen at the same time.
classNamestringundefinedOptional class names for the container section.
imgClassstring"w-40 h-48"Class names for individual image elements, particularly for adjusting sizing constraints.

Dependencies

motion/react