Count up
These modular elements can be readily used and customized in every layout across pages.
For more detail see, CountUP Documentation
Example
CountUp.js is a dependency-free, lightweight JavaScript class that can be used to quickly create animations that display numerical data in a more interesting way.
0
(Default)
0
(Duration 10s)
0
(Comma)
0
(Space)
0
(suffix)
0
(Prefix)
<div class="row">
<div class="col-6 col-md-4 col-xl mb-2 mb-lg-0 text-center">
<span class="fs-3 fw-medium" data-countup='{"endValue":36487}'>0</span>
<h6>(Default) </h6>
</div>
<div class="col-6 col-md-4 col-xl mb-2 mb-lg-0 text-center">
<span class="fs-3 fw-medium" data-countup='{"endValue":23542,"duration":10}'>0</span>
<h6>(Duration 10s) </h6>
</div>
<div class="col-6 col-md-4 col-xl mb-2 mb-lg-0 text-center">
<span class="fs-3 fw-medium" data-countup='{"endValue":36487,"separator":""}'>0</span>
<h6>(Comma) </h6>
</div>
<div class="col-6 col-md-4 col-xl mb-2 mb-lg-0 text-center">
<span class="fs-3 fw-medium" data-countup='{"endValue":36487,"separator":" "}'>0</span>
<h6>(Space) </h6>
</div>
<div class="col-6 col-md-4 col-xl mb-2 mb-lg-0 text-center">
<span class="fs-3 fw-medium" data-countup='{"endValue":36.487,"decimalPlaces":2,"suffix":"k"}'>0</span>
<h6>(suffix) </h6>
</div>
<div class="col-6 col-md-4 col-xl mb-2 mb-lg-0 text-center">
<span class="fs-3 fw-medium" data-countup='{"endValue":36487,"prefix":"$"}'>0</span>
<h6>(Prefix)</h6>
</div>
</div>