Cursor Image Follow

How it works

As the cursor moves, images are placed along its path. The distance and timing between images can be controlled, and each image animates on entry and exit using configurable motion settings. Images automatically disappear after a set lifetime, keeping the interaction lightweight and performant.

You can run the effect globally across the entire screen or restrict it to a specific container area for controlled interactions and layouts.

Key features

• Cursor-based image follow and trail effect

• Supports multiple images with sequential or randomized order

• Adjustable spacing and timing between images

• Entry and exit animations with scale and opacity control

• Global (window) or container-based interaction scope

• Visual styling controls including blend mode, blur, grayscale, brightness, radius, border, and shadow

• Designed for smooth performance and easy customization

Customization & Styling

The settings control how images appear and behave as the cursor moves. You can define the image source, interaction scope, size, aspect ratio, order, spacing, and lifetime, as well as add variation through scatter and rotation.

Animation and visual options let you fine-tune how images enter and exit and how they look. Adjust animation curves, scale and opacity, and customize styling with fit modes, blend modes, filters, layering, radius, borders, and shadows to match your design.

Notes

• Best used with a moderate number of images for optimal performance

• Works with mouse and trackpad input

• Fully configurable through Framer’s property panel

• No external dependencies required