AnimateNumber
AnimateNumber creates beautiful number animations with Motion.
You can create a number of popular animation effects, like countdowns, engagement bars, or labelling user inputs.
It's a continuation of the original version of Max Barvian's NumberFlow component, which was built on Motion.
Because AnimateNumber leverages Motion's existing layout animations, it's only 2.5kb on top of Motion for React. It also means you can use Motion's existing transition settings.
However, being based on an older version of NumberFlow means it currently lacks a couple of its newer props like trend and plugins.
In this guide, we'll learn how to install AnimateNumber into our projects, and how to use it for a variety of number animation effects.