// pointer playground
Cursor Physics
One pointer, four experiments: a velocity-stretched spring cursor, magnetic targets with different pull strengths, an elastic follower chain, reactive cursor modes, and a repulsion field that gets out of your way. Click anywhere for the wholly unnecessary shockwave.
- Pointer Events
- Spring integration
- requestAnimationFrame
- CSS transforms
- 0 libraries
01 / magnetic pull
Different gravity wells.
Each target bends the cursor toward its centre and shifts its own surface toward the incoming pointer.
02 / cursor states
Same pointer, different jobs.
The ring changes shape, scale, colour, label, and spring response based on the surface beneath it.
03 / repulsion field
A grid with boundaries.
Every point measures its distance from the pointer and eases away inside a local influence radius.
04 / elastic chain
Six followers, one bad influence.
The coloured tail is a linked chain: each node follows the one before it, so delay compounds into a fluid curve.
Touch, coarse pointers, and reduced-motion preferences keep the native cursor and a calm layout.