CSS Spring Timing Generator
Simulate a damped spring and generate a CSS linear() timing function.
Processing stays in your browser. Samples the physical response from rest to a unit target. The last value is forced to 1 for CSS completion; choose a long enough duration to avoid a visible snap. Requires CSS linear() support.
How to use the css spring timing generator
Simulate a damped spring and generate a CSS linear() timing function. Complete the mass, stiffness, damping, sample duration (seconds) fields above. Choose Run tool, review the output, then copy or download the result.
Example
Lower damping creates more overshoot.
Good to know
Samples the physical response from rest to a unit target. The last value is forced to 1 for CSS completion; choose a long enough duration to avoid a visible snap. Requires CSS linear() support.