Elastic Snap Line

Elastic Snap Line

About Elastic Snap Line

A thin line stretches toward your cursor as you approach, and when you let go it snaps back and vibrates — a real underdamped spring that oscillates a few visible times before settling. The release keeps the exact velocity of your gesture, which is what makes it feel like a plucked string instead of an animation.

The bow is bounded so it never escapes its frame, whatever size you give it. Optional end dots, optional label above the line — it works as a section divider with a title, or as a pure interactive accent.

The loop only runs while the line is deformed or vibrating; at rest it costs nothing.

SVG and requestAnimationFrame, no dependencies, nothing loaded from outside. Honours prefers-reduced-motion, and renders as a clean straight line on the Framer canvas.