Animated Number Morph

An Apple-grade smooth rolling digit counter that independently morphs individual numerical columns with physics-based springs, locale commas, currencies, and compact notation.

Live Production ARR
$
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
,
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
+
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
.
0
1
2
3
4
5
6
7
8
9
%
annualized expansion
Live Playground

Installation

Add the component directly to your repository using shadcn CLI:

npx shadcn@latest add Surajmaurya1/easyui/animated-number

API Reference

PropTypeDefaultDescription
valuenumber0The numeric target value to morph towards
decimalsnumber0Number of decimal places to preserve
prefixstring''Text or currency prepended to number (e.g. "
quot;)
suffixstring''Text or unit appended to number (e.g. "%", "ms")
useGroupingbooleantrueFormats with comma separators
compactbooleanfalseFormats using compact abbreviations (K, M, B)
stiffnessnumber170Spring transition stiffness
dampingnumber22Spring transition damping