Components
Icon Box
An icon, heading and text, in many layouts.
Live demo
See it in action
Fast
An icon, a heading and a line of supporting text.
Flexible
Many layouts and hover styles to choose from.
Free
Every element is free under the GPL.
The markup
Clean, lean code
This is the exact HTML the element outputs, straight from the page builder. No wrapper soup, no inline-style bloat.
<section>
<div class="fw-container">
<div class="fw-row">
<div class="fw-col-12 fw-col-sm-4">
<div class="icon-box ib-75d8843e icon-box__wrapper icon-box--style-top-title icon-box--mobile-stack">
<div class="icon-box__inner icon-box__inner--top">
<div class="icon-box__icon-align text-center">
<span class="icon-box__icon" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="1.4em" height="1.4em"><path d="M13 2L3 14h7l-1 8 10-12h-7z" /></svg></span>
</div>
<h4 class="icon-box__title">Fast</h4>
<div class="icon-box__content">
<p>An icon, a heading and a line of supporting text.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>To learn more about the Icon Box shortcode, please check out the online manual here.
Free & open source
Build with this element, free.
Install the framework and the Bootstrap 5 theme, then drag this element into any page.