Cursor Trial
Dev Resources
Overview
Cursor Trail reimagines pointer movement as a stream of evolving imagery, transforming simple gestures into a fluid sequence of photographs that appear, align, and disappear over time. A direction-aware rotation system powered by atan2 keeps every frame synchronized with the path of travel, while interpolation-driven spawning preserves the trail’s density and rhythm at any speed. Built around a reusable image pool and GSAP-powered motion, the interaction remains remarkably smooth while maintaining a lightweight footprint.
Tech Stack
- React 19
- Vite
- GSAP
- Tailwind CSS
Highlights
- Distance-threshold spawning with multi-point interpolation fills trail gaps at high cursor velocity
- atan2-based angle calculation rotates each image to match live cursor direction
- Passive touchmove listener mirrors full touch support alongside mouse input
- Fixed 13-node DOM pool — images recycled via gsap.utils.wrap with full property clearing between uses
- GSAP ticker integration drives a frame-locked animation loop with automatic React lifecycle cleanup
- Viewport-relative typography with responsive vw-unit sizing scales fluidly across breakpoints
Formats
Github RepositoryGet Access to this Resource
Get instant access to your custom-built website, complete with stunning design and seamless functionality. Start showcasing your brand today!
Contact Us