Snake Trail
A living kinematic snake with sine-wave slither follows your pointer.
Props
| Property | Type | Default | Description |
|---|---|---|---|
| color | string | #a855f7 | Body color of the snake |
| segmentCount | number | 32 | Number of body segments — more = longer snake |
When to Use
Perfect for experimental brands, bio-tech sites, gaming, and any context where a living creature cursor adds memorable personality.
Best Practices
Keep segmentCount between 20-48. The snake uses mix-blend-screen so it glows beautifully over dark backgrounds. Desktop only — requires pointer:fine.
Why This Component Matters
A kinematic snake is one of the most technically impressive cursor effects — it demonstrates organic physics that static cursors simply cannot achieve.
FAQ
QDoes it work on mobile?
No — it requires a fine pointer (mouse). On touch devices the snake is hidden and the hero section renders normally.
QWhy does the head glow lime green?
The head uses a contrasting #a3e635 color so it's visually distinct from the body. This can be changed in source.
Related Components
Broken Shard Gallery
Images explode outward from center into a chaotic gallery layout as you scroll.
Velocity Smear
Gallery that skews and stretches in real-time based on scroll velocity — the faster you scroll, the more the images smear.
Curtain Split
Two image panels split apart like stage curtains on scroll, revealing editorial text content hidden beneath.