Cursor Trailer
An advanced cursor trail component that places any elements along the mouse path. A wide set of well-organized properties gives full creative freedom to build unique experiences!
Make it with Workshop
Build your own component with AI
An advanced cursor trail component that places any elements along the mouse path. A wide set of well-organized properties gives full creative freedom to build unique experiences!
Make it with Workshop
Build your own component with AI
⚠️ Use the preview link for the best experience: Preview ↗
With this component alone, you can create completely unique trail effects tailored to your design! No built-in UI, no creative limits, just smooth, interactive trails that grab attention, add playful motion, and make your website more engaging.
Items (property) — select any canvas elements to appear along your trail, from icons and images to custom components.
Area (property) — choose where the trail follows the cursor: full viewport, parent container, or component, giving you complete placement control.
Trail (section) — customize spacing, rotation, path smoothing, and max item count. Multiple modes let you create smooth, expressive, and fully interactive cursor trails.
Fade (section) — pick from three fade modes and fine-tune opacity, scale, and blur for dynamic, attention-grabbing motion effects.
Drift (section) — control drift independently on X and Y axes with adjustable transition timing and easing, adding natural, lively movement to your trail.
Add Cursor Trailer to the canvas.
Connect one or more elements as trail items.
Select the Area depending on where the trail should appear.
Configure the trail effects as needed using the component properties.
Preview interactions and refine settings to match your design intent.
Touch devices are automatically detected and ignored to prevent unwanted behavior.
If you want to use Cursor Trailer in a layout template, make sure all items have width and height set to fit their content;
When using the Viewport or Parent Element area, ensure the component is placed in the top-left corner of the viewport or parent element;
Do not use this code component inside other components.
