Changing it
Easing
Easing here does not move anything. Each motion runs on a cyclic phase, and the curve reshapes that phase — the same path, walked at a different rate. That one decision is why a curve can be dropped on any of the 28 families without breaking it, and why swapping one never breaks a loop.
Scrub it and watch
Pick a curve, then drag the phase across two full cycles. The two dots are the raw phase and the eased phase.
The ticks are the square’s position at 21 equal slices of time. Where they crowd, the motion is slow; where they spread, it is fast. That spacing is what the curve does — the plot below is the same fact, drawn.
Drag either handle and the square above changes with it. The four numbers are the bezier control points — x is clamped to the unit interval, y is free, so a curve can overshoot.
The physics curves have nothing to drag: they are sampled from real functions rather than built from handles, so the plot shows the curve and the handles disappear.
{ id: 'glide' } // cubic-bezier(0.33, 0.00, 0.00, 1.00)Why the loop survives
The renderer reshapes a phase as floor(p) + ease(frac(p)). Whole numbers are fixed points of that expression: at every integer the eased phase is the raw phase. So a motion that was tuned to complete a whole number of cycles per clip still completes them, on any curve, and frame 0 still equals the last frame.
That is also the reason easing lives on the track rather than inside each template. A template hands its raw phase to ctx.easedPhase and inherits whatever curve the scene is on; it never needs to know which one.
Three groups, on purpose
Signature curves are the named ones most families ship with. Standard is the in / out / in-out ladder, from Sine through Expo — the same shapes CSS gives you, so they behave the way your eye already expects. Physics is different in kind: Bounce, Spring, Wiggle and Overshoot have no bezier handles at all and are sampled from real functions, which is why their curves leave the unit box. A bounce that never passes its target is not a bounce.
Practical consequence: the curve editor can only show handles for a bezier-backed curve. Drag a handle on one of those and the scene stores { id: 'custom', bezier: [...] } instead of a preset name. The physics curves have nothing to drag.
Every family already ships one
A template declares its own default curve, and a preset can override it — because for anything that steps per item the curve is what separates a glide from a settle. So the honest way to read “this preset feels wrong” is usually: the curve is right and the clip length is not, or the other way round. See The Library on why some presets pin the duration.