Animated Countup Component For React

Description:

A lightweight and easy-to-implement countup & countdown animation component for React apps.

How to use it:

1. Install and import the ‘Countup’ component into your React app.

import Countup from "react-countup-animate";
# NPM
$ npm install react-countup-animate

2. Add the Countup component to the app and specify the target number the counter should count up toward.

<Countup number={1000} />

3. You can also make the counter countdown from a specific number:

<Countup number={1000} reverse={true} />

4. More component props.

number = "1,234,567",
duration = 3,
startDelay = 0.1,
endDelay = 0.1,
easeStartDuration = Math.max(duration / 3, 1),
easeEndDuration = Math.max(duration / 3, 1),
reverse = false,
style,

Preview:

Animated Countup Component For React

Add Comment