paprika-tween/easing

Easing equations are used to calculate the amount of progression of a value over time.
In Paprika 🌶 you can use the following easing equations to give a more natural movement to the animations of the spices.
Since:
  • 1.0.0
Source:

Example

import { Spice } from 'paprika-tween';
import { Elastic } from 'paprika-tween/easing';
const spice = new Spice({
    duration: 120,
    easing: Elastic.InOut,
    from: { rotation: 10 },
    to: { rotation: 520 },
    render: ({ rotation }) => { ... }
});
spice.start();
(function loop(timestamp) {
    spice.frame(timestamp);
    requestAnimationFrame(loop);
})()