Wind Trail
An interactive mouse trail that maps spawned elements to an ambient wind physics engine, drifting items smoothly across the screen like autumn leaves.
Last Modified:Aug 17, 2026
Install
CLI
wind-trail
Or install a specific demo variant:
wind-trail-avatars-demo
Or install a specific demo variant:
wind-trail-images-demo
Manual
1. Add Source Code
Note: This component utilizes pure DOM manipulation and RequestAnimationFrame logic. No external libraries are required.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
imageUrls | string[] | [] | Array of image URLs to randomly spawn. |
distance | number | 200 | Distance the pointer must move (in pixels) before spawning a new item. |
duration | number | 2600 | The total lifespan of a spawned item in milliseconds. |
maxItems | number | 10 | Maximum items on screen before forcing the oldest to fade out. |
itemSize | number | 90 | The base pixel size of the image cards. |
windX | number | 100 | Base horizontal wind speed in pixels per second. |
windY | number | -30 | Base vertical wind speed in pixels per second. |
className | string | undefined | Standard Tailwind classes for the fixed wrapper. |
itemClassName | string | "" | Standard Tailwind classes applied to the individual image wrappers. |