Motion-Primitives Pro is live - Advanced components and templates to help you build delightful websites, faster.

Animated Number

Easily animate numbers.

Examples

Basic

0

Basic counter

1,000

With useInView

0

Installation

npx shadcn add "https://motion-primitives.com/c/animated-number.json"

Component API

PropTypeDefaultDescription
valuenumberThe number to be animated.
classNamestringOptional CSS class for styling the number item container.
springOptionsSpringOptionsSpring options from motion for the animation.
asReact.ElementType'span'The HTML tag to render the number in.