Beta
Animate UI

Sliding Number

A numeric display component that smoothly animates number changes with a sliding transition effect.

Made by imskyleen

Installation

Usage

<SlidingNumber number={1000} />

Examples

With decimal

Props

PropTypeDefault
transition?
SpringOptions
{ stiffness: 200, damping: 20, mass: 0.4 }
decimalPlaces?
number
0
decimalSeparator?
string
.
padStart?
boolean
false
inViewOnce?
boolean
true
inViewMargin?
string
0px
inView?
boolean
false
number
number | string
-
className?
string
-

Credits

Built by Skyleen. The source code is available on GitHub.

On this page