Dynamic Icon Navigation
Floating pill dock with kinetic icon reveal on cursor approach.
Context
A dock navigation where icons reveal contextually based on cursor proximity, instead of waiting for a click. The question behind it: how much navigation can happen before the click, purely through hover intent?
The interesting part
Each icon's expansion is driven by distance to cursor, not hover state. Hover is binary; distance is continuous. Mapping cursor distance to scale through an exponential falloff gives the dock a magnetic, kinetic feel where icons lean toward the pointer before any interaction happens. All of it runs in a single requestAnimationFrame loop updating transforms, so there is no re-render per frame.
Show it
A detail
The falloff curve is tuned asymmetrically: the icon nearest the cursor reaches full scale, while its neighbors only approach it. That asymmetry is what makes the dock feel like it has depth instead of looking like a uniform wave.
What I learned
Continuous input (distance) beats discrete state (hover) for anything that should feel physical.