Text
CountUp
Number animates smoothly from a start value to a target value with easing and formatting.
Installation
npm install @ai-animate/core
Usage
import { CountUp } from '@ai-animate/core'
<CountUp to={1000000} from={0} duration={2500} prefix="$" />
Props
tonumber—Final number value (required)
fromnumber0Starting number value
durationnumber2000Animation duration in milliseconds
prefixstring''String prefix (e.g. '$')
suffixstring''String suffix (e.g. '%')
separatorstring','Thousands separator character
decimalsnumber0Decimal places to show
easing'linear' | 'ease-out' | 'spring''ease-out'Easing function
fontSizestring'clamp(2rem, 4vw, 3.5rem)'Font size
colorstring'#ffffff'Text color
fontWeightnumber800Font weight
loopbooleanfalseWhether to loop the animation
holdMsnumber1500Time to hold at final value before looping in ms
classNamestringundefinedAdditional CSS class