Statistics - Static
Great flexibility with the usage of SVG and responsive design, the stats blocks are advanced features to present the stats of your business.
Static #1
25
Top rated
agency companies
$19
Historical earnings
per click
50%
Average
registration rate
<!-- Stats Section -->
<div class="container space-2">
<div class="row justify-content-center">
<div class="col-sm-4 col-lg-3 mb-7 mb-sm-0">
<!-- Stats -->
<div class="text-center">
<div class="position-relative">
<div class="u-indicator-dots">
<h4 class="display-4 text-primary mb-0">25</h4>
</div>
</div>
<p class="mb-0">Top rated<br>agency companies</p>
</div>
<!-- End Stats -->
</div>
<div class="col-sm-4 col-lg-3 mb-7 mb-sm-0">
<!-- Stats -->
<div class="text-center">
<div class="position-relative">
<div class="u-indicator-dots">
<h4 class="display-4 text-primary mb-0">$19</h4>
</div>
</div>
<p class="mb-0">Historical earnings<br>per click</p>
</div>
<!-- End Stats -->
</div>
<div class="col-sm-4 col-lg-3 mb-7 mb-sm-0">
<!-- Stats -->
<div class="text-center">
<div class="position-relative">
<h4 class="display-4 text-primary mb-0">50%</h4>
</div>
<p class="mb-0">Average<br>registration rate</p>
</div>
</div>
</div>
<!-- End Stats -->
</div>
<!-- End Stats Section -->
Static #2
2M
2 million daily active users
7k
Over 7k open job positions
10M
Over 10 million stories shared
<!-- Stats Section -->
<div class="container space-2">
<div class="row justify-content-md-between">
<div class="col-sm-6 offset-sm-3 col-lg-4 offset-lg-0 mb-7 mb-lg-0">
<!-- Figures -->
<div class="text-center">
<h3 class="display-2 text-primary font-weight-semi-bold">2M</h3>
<p>2 million daily active users</p>
</div>
<!-- End Figures -->
</div>
<div class="col-sm-6 col-lg-4 mb-7 mb-sm-0">
<!-- Figures -->
<div class="text-center">
<h3 class="display-2 text-primary font-weight-semi-bold">7k</h3>
<p>Over 7k open job positions</p>
</div>
<!-- End Figures -->
</div>
<div class="col-sm-6 col-lg-4">
<!-- Figures -->
<div class="text-center">
<h3 class="display-2 text-primary font-weight-semi-bold">10M</h3>
<p>Over 10 million stories shared</p>
</div>
<!-- End Figures -->
</div>
</div>
</div>
<!-- End Stats Section -->
Static #3
$45.99
Available balance
$1.32
Reward balance
$0.00
Pending balance
<!-- Stats -->
<div class="card-deck d-block d-lg-flex card-lg-gutters-3 mb-6">
<!-- Card -->
<div class="card mb-3 mb-lg-0">
<div class="card-body p-5">
<div class="media align-items-center">
<span class="btn btn-lg btn-icon btn-soft-primary rounded-circle mr-4">
<span class="fas fa-dollar-sign btn-icon__inner"></span>
</span>
<div class="media-body">
<span class="d-block font-size-3">$45.99</span>
<h2 class="h6 text-secondary font-weight-normal mb-0">Available balance</h2>
</div>
</div>
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card mb-3 mb-lg-0">
<div class="card-body p-5">
<div class="media align-items-center">
<span class="btn btn-lg btn-icon btn-soft-success rounded-circle mr-4">
<span class="fas fa-coins btn-icon__inner"></span>
</span>
<div class="media-body">
<span class="d-block font-size-3">$1.32</span>
<h3 class="h6 text-secondary font-weight-normal mb-0">Reward balance</h3>
</div>
</div>
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card">
<div class="card-body p-5">
<div class="media align-items-center">
<span class="btn btn-lg btn-icon btn-soft-warning rounded-circle mr-4">
<span class="fas fa-exchange-alt btn-icon__inner"></span>
</span>
<div class="media-body">
<span class="d-block font-size-3">$0.00</span>
<h3 class="h6 text-secondary font-weight-normal mb-0">Pending balance</h3>
</div>
</div>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Stats -->