Box
Border-radius 0.5em
Border-radius 0.5em
Border-radius 0.5em
<div class="bg-white p-5 border-radius">
<p>Border-radius 0.5em</p>
</div>
<div class="bg-white p-5 border-radius-1">
<p>Border-radius 0.5em</p>
</div>
<div class="bg-white p-5 border-radius-2">
<p>Border-radius 0.5em</p>
</div>
Box shadow
Hover Float
<div class="bg-white p-5 box-shadow">
<p>Box shadow</p>
</div>
<div class="bg-white p-5 hover-float">
<p>Hover Float</p>
</div>
Interactive box
<div class="interactive-box border-radius-1">
<img src="../assets/images/img-src.jpg" alt="">
<div class="interactive-overlay">
<div class="interactive-inner p-4 p-lg-5">
<h6 class="uppercase mb-0">Interactive box title</h6>
</div>
<div class="interactive-hover p-4 p-lg-5">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do</p>
</div>
</div>
</div>
Icon box
<div class="icon-box-square icon-box-square-lg bg-dark">
<i class="bi bi-star"></i>
</div>
<div class="icon-box-square bg-dark">
<i class="bi bi-star"></i>
</div>
<div class="icon-box-square icon-box-square-sm bg-dark">
<i class="bi bi-star"></i>
</div>
<div class="icon-box-circle icon-box-circle-lg bg-dark">
<i class="bi bi-star"></i>
</div>
<div class="icon-box-circle bg-dark">
<i class="bi bi-star"></i>
</div>
<div class="icon-box-circle icon-box-circle-sm bg-dark">
<i class="bi bi-star"></i>
</div>