Circle accents for indicating features and screenshots of a product.
Code:
<div class="row"> <div class="col-md-3"> <img src="http://via.placeholder.com/500x500" alt="" class="img-fluid rounded-circle border border-primary mt-2"> <a href="#" class="btn btn-dark btn-block mt-2">Lorem Ipsum</a> </div> <div class="col-md-3"> <img src="http://via.placeholder.com/500x500" alt="" class="img-fluid rounded-circle border border-primary mt-2"> <a href="#" class="btn btn-dark btn-block mt-2">Lorem Ipsum 2</a> </div> <div class="col-md-3"> <img src="http://via.placeholder.com/500x500" alt="" class="img-fluid rounded-circle border border-primary mt-2"> <a href="#" class="btn btn-dark btn-block mt-2">Lorem Ipsum 3</a> </div> <div class="col-md-3"> <img src="http://via.placeholder.com/500x500" alt="" class="img-fluid rounded-circle border border-primary mt-2"> <a href="#" class="btn btn-dark btn-block mt-2">Lorem Ipsum 4</a> </div> </div>