Preloader

Loading...

Odometer

Odometer is a Javascript and CSS library for smoothly transitioning numbers

Odometer's animations are handled entirely in CSS using transforms making them extremely performant, with automatic fallback on older browsers.

The library and largest theme is less than 3kb when minified and compressed.

Odometer documentation


Continuous
growth with
+k

New accounts

Successfully
completed
+

Finished projects

Recruit more
than
+

Skilled experts

Increase internet
awareness
+k

Media posts

                
<div class="row justify-content-between">
    <div class="col-xl-3 col-lg-4 col-sm-6">
        <div class="counter-item-cover counter-item">
            <div class="content text-center mx-auto">
                <h6>
                    Continuous <br />
                    growth with
                </h6>
                <span class="h1 count fw-black text-primary my-0">+<span class="odometer" data-count="24"></span><span>k</span></span>
                <p class="fs-5">New accounts</p>
            </div>
        </div>
    </div>
    <div class="col-xl-3 col-lg-4 col-sm-6">
        <div class="counter-item-cover counter-item">
            <div class="content text-center mx-auto">
                <h6>
                    Successfully <br />
                    completed
                </h6>
                <span class="h1 count fw-black text-primary my-0">+<span class="odometer" data-count="124"></span></span>
                <p class="fs-5">Finished projects</p>
            </div>
        </div>
    </div>
    <div class="col-xl-3 col-lg-4 col-sm-6">
        <div class="counter-item-cover counter-item">
            <div class="content text-center mx-auto">
                <h6>
                    Recruit more <br />
                    than
                </h6>
                <span class="h1 count fw-black text-primary my-0">+<span class="odometer" data-count="865"></span></span>
                <p class="fs-5">Skilled experts</p>
            </div>
        </div>
    </div>
    <div class="col-xl-3 col-lg-4 col-sm-6">
        <div class="counter-item-cover counter-item">
            <div class="content text-center mx-auto">
                <h6>
                    Increase internet <br />
                    awareness
                </h6>
                <span class="h1 count fw-black text-primary my-0">+<span class="odometer" data-count="168"></span><span>k</span></span>
                <p class="fs-5">Media posts</p>
            </div>
        </div>
    </div>
</div>