mljr-ui · showcase

Spring Physics

Motion.spring() produces physics-based easing. Tune stiffness, damping, and mass for wildly different feels.

animation ds-anim-spring

Usage

// Motion.spring() returns an easing generator — pass to easing option
// No duration needed; spring settles at its natural time.
Motion.animate(el, { y: 150 }, {
    easing: Motion.spring({ stiffness: 300, damping: 8, mass: 1 }),
})

// Configs by feel:
// Stiff  → stiffness:800, damping:25   (fast, minimal overshoot)
// Bouncy → stiffness:200, damping:5    (oscillates several times)
// Slow   → stiffness:100, damping:15   (heavy, lazy)
// Snap   → stiffness:600, damping:40   (crisp, one bounce)