Cursor Ring Field

A stateful capsule field pushed by a luminous pointer ring; each mark retains velocity, overshoots and settles back to its seeded home position.

• Hero backdrops
• Section transitions
• Ambient product moments

• Per-capsule position and velocity state persists between animation frames
• Circular pressure band remains crisp during fast pointer movement
• Capsules rotate toward the ring with seeded angular noise
• Autonomous dual-axis wander keeps the field active without a pointer
• Every control maps directly to this component's independent renderer contract
• Full-size and compact previews use the same implementation and behavior

Adaptive sampling, capped DPR and visibility-based suspension keep the renderer predictable. Test density on low-power mobile hardware before increasing it.

Pointer and touch coordinates are container-scoped; offscreen renderers stop work and pixel ratio is capped.

The visual canvas is decorative by default. Pair it with a semantic heading or description, and reduced motion holds a stable rendered frame.