You can easily change what icon will be displayed in box by changing icon class. Here you will find full set of icons.
{Theme} have 3 varations of icon boxes that are using the classes you can see below.
- .ct-iconBox–style2
- .ct-iconBox–inline
- .ct-iconBox–small
HTML markup
1 2 3 4 5 6 7 8 |
<div class="ct-iconBox"> <div class="ct-iconBox-icon"><i class="fa fa-line-chart"></i> </div> <div class="ct-iconBox-description"> <h4 class="ct-iconBox-title">fb & aw campaigns</h4><span class="ct-iconBox-subtitle">integer a mattis diam, at sagittis dolor.</span> <p>Nam a diam tincidunt, condimentum nisi et, fringilla lectus. Nullam nec lectus eu erat tempus pulvinar. Quisque mauris felis, porta et cursus vel.</p> </div> </div> |
Screenshot
HTML markup
1 2 3 4 5 6 7 |
<div class="ct-iconBox ct-iconBox--inline ct-iconBox--small"> <div class="ct-iconBox-icon"><i class="fa fa-exclamation-triangle"></i> </div> <div class="ct-iconBox-description"> <h4 class="ct-iconBox-title">I’ll find your weakness</h4><span class="ct-iconBox-subtitle">Integer a mattis diam at sagittis</span> </div> </div> |
Screenshot
HTML markup
1 2 3 4 5 6 7 8 |
<div class="ct-iconBox ct-iconBox--style2"> <div class="ct-iconBox-icon"><i class="fa fa-line-chart"></i> </div> <div class="ct-iconBox-description"> <h4 class="ct-iconBox-title">fb & aw campaigns</h4><span class="ct-iconBox-subtitle">integer a mattis diam, at sagittis dolor.</span> <p>Nam a diam tincidunt, condimentum nisi et, fringilla lectus. Nullam nec lectus eu erat tempus pulvinar. Quisque mauris felis, porta et cursus vel.</p> </div> </div> |
Screenshot