Icons
Types
<span class="icon icon-primary">
<i class="bi-house"></i>
</span>
<span class="icon icon-soft-primary">
<i class="bi-house"></i>
</span>
Color variants
<span class="icon icon-primary">
<i class="bi-house"></i>
</span>
<span class="icon icon-secondary">
<i class="bi-house"></i>
</span>
<span class="icon icon-success">
<i class="bi-house"></i>
</span>
<span class="icon icon-danger">
<i class="bi-house"></i>
</span>
<span class="icon icon-warning">
<i class="bi-house"></i>
</span>
<span class="icon icon-info">
<i class="bi-house"></i>
</span>
<span class="icon icon-light">
<i class="bi-house"></i>
</span>
<span class="icon icon-dark">
<i class="bi-house"></i>
</span>
Soft icons
<span class="icon icon-soft-primary">
<i class="bi-house"></i>
</span>
<span class="icon icon-soft-secondary">
<i class="bi-house"></i>
</span>
<span class="icon icon-soft-success">
<i class="bi-house"></i>
</span>
<span class="icon icon-soft-danger">
<i class="bi-house"></i>
</span>
<span class="icon icon-soft-warning">
<i class="bi-house"></i>
</span>
<span class="icon icon-soft-info">
<i class="bi-house"></i>
</span>
<span class="icon icon-soft-light">
<i class="bi-house"></i>
</span>
<span class="icon icon-soft-dark">
<i class="bi-house"></i>
</span>
Sizes
<span class="icon icon-lg icon-primary">
<i class="bi-house"></i>
</span>
<span class="icon icon-primary">
<i class="bi-house"></i>
</span>
<span class="icon icon-sm icon-primary">
<i class="bi-house"></i>
</span>
<span class="icon icon-xs icon-primary">
<i class="bi-house"></i>
</span>
Circle
<span class="icon icon-lg icon-primary icon-circle">
<i class="bi-house"></i>
</span>
<span class="icon icon-primary icon-circle">
<i class="bi-house"></i>
</span>
<span class="icon icon-sm icon-primary icon-circle">
<i class="bi-house"></i>
</span>
<span class="icon icon-xs icon-primary icon-circle">
<i class="bi-house"></i>
</span>