

Argon Dashboard Components
Discover 18 components available in Argon Dashboard
Card List Group
Card Balance
Card Image
Card Balance Empty
Card Simple

<div class="card draggable">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-primary">Button</a>
</div>
</div>
<div class="card draggable">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-primary">Button</a>
</div>
</div>
Card Stats

<div class="card card-stats draggable">
<div class="card-body">
<div class="row">
<div class="col">
<h5 class="card-title text-uppercase text-muted mb-0">New users</h5>
<span class="h2 font-weight-bold mb-0">2,356</span>
</div>
<div class="col-auto">
<div class="icon icon-shape bg-orange text-white rounded-circle shadow">
<i class="fa fa-chart-pie"></i>
</div>
</div>
</div>
<p class="mt-3 mb-0 text-sm">
<span class="text-success mr-2">
<i class="fa fa-arrow-up"></i> 3.48% </span>
<span class="text-nowrap">Since last month</span>
</p>
</div>
</div>
<div class="card card-stats draggable">
<div class="card-body">
<div class="row">
<div class="col">
<h5 class="card-title text-uppercase text-muted mb-0">New users</h5>
<span class="h2 font-weight-bold mb-0">2,356</span>
</div>
<div class="col-auto">
<div class="icon icon-shape bg-orange text-white rounded-circle shadow">
<i class="fa fa-chart-pie"></i>
</div>
</div>
</div>
<p class="mt-3 mb-0 text-sm">
<span class="text-success mr-2">
<i class="fa fa-arrow-up"></i> 3.48% </span>
<span class="text-nowrap">Since last month</span>
</p>
</div>
</div>