jQuery Counters

<div class="row">
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-3 mb-4 mb-lg-0">
        <span class="counter display-3 text-dark d-block">500</span>
        <span class="h5 text-gray">Happy people</span>
    </div>
    <!--End of Counter-->
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-3 mb-4 mb-lg-0">
        <span class="counter display-3 text-dark d-block">1560</span>
        <span class="h5 text-gray">Units Ordered</span>
    </div>
    <!--End of Counter-->
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-3 mb-4 mb-lg-0">
        <span class="counter display-3 text-dark d-block">5478</span>
        <span class="h5 text-gray">Subscribers</span>
    </div>
    <!--End of Counter-->
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-3 mb-4 mb-lg-0">
        <span class="counter display-3 text-dark d-block">12031</span>
        <span class="h5 text-gray">Lines of Code</span>
    </div>
    <!--End of Counter-->
</div>

<div class="row mb-6">
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-3 mb-5 mb-lg-0 text-center">
        <div class="icon icon-shape shadow-inset border-light rounded-circle mb-4">
            <span class="far fa-laugh-beam"></span>
        </div>
        <span class="counter h1 d-block">500</span>
        <span class="h5">Happy people</span>
    </div>
    <!--End of Counter-->
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-3 mb-5 mb-lg-0 text-center">
        <div class="icon icon-shape shadow-soft border-light rounded-circle mb-4">
            <span class="fas fa-shipping-fast"></span>
        </div>
        <span class="counter h1 d-block">1560</span>
        <span class="h5">Units Ordered</span>
    </div>
    <!--End of Counter-->
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-3 mb-5 mb-lg-0 text-center">
        <div class="icon icon-shape shadow-soft border border-light rounded-circle mb-4">
            <span class="fas fa-globe-europe"></span>
        </div>
        <div class="shadow-soft rounded border border-light py-4">
            <span class="counter h1 d-block">15</span>
            <span class="h5">Countries</span>
        </div>
    </div>
    <!--End of Counter-->
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-3 mb-3 mb-lg-0 text-center">
        <div class="icon icon-shape shadow-inset border border-light rounded-circle mb-4">
            <span class="fas fa-fire-alt"></span>
        </div>
        <div class="shadow-inset rounded border border-light py-4">
            <span class="counter h1 d-block">300</span>
            <span class="h5">Events</span>
        </div>
    </div>
    <!--End of Counter-->
</div>

<div class="row">
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-4 mb-5 mb-lg-0 text-center">
        <div class="card bg-primary shadow-soft border-light p-4">
            <div class="card-body">
                <div class="icon icon-shape shadow-inset rounded mb-4">
                    <span class="fab fa-mailchimp"></span>
                </div>
            </div>
            <div class="card-footer shadow-inset rounded">
                <span class="counter h1 d-block">5478</span>
                <span class="h5">Subscribers</span>
            </div>
        </div>
    </div>
    <!--End of Counter-->
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-4 text-center">
        <div class="card bg-primary shadow-inset border-light p-4">
            <div class="card-body">
                <div class="icon icon-shape shadow-soft rounded mb-4">
                    <span class="fas fa-file-contract"></span>
                </div>
            </div>
            <div class="card-footer shadow-soft rounded">
                <span class="counter h1 d-block">478</span>
                <span class="h5">Projects</span>
            </div>
        </div>
    </div>
    <!--End of Counter-->
    <!--Counter-->
    <div class="col-12 col-sm-6 col-lg-4 text-center">
        <div class="card bg-primary shadow-inset border-light p-3">
            <div class="card-body shadow-soft border border-light rounded">
                <div class="icon icon-shape rounded-circle shadow-inset mb-4">
                    <span class="fas fa-file-contract"></span>
                </div>
                <span class="counter h1 d-block">478</span>
                <span class="h5">Projects</span>
            </div>
        </div>
    </div>
    <!--End of Counter-->
</div>

$('.counter').counterUp({
    delay: 10,
    time: 1000,
    offset: 70,
    beginAt: 100,
    formatter: function (n) {
        return n.replace(/,/g, '.');
    }
});