Icon Box is a straightforward block for the Gutenberg editor that lets you pair a stylish icon with text inside a fully customizable box.

Plugin Envision

<h4>🤝 <a href="https://pluginenvision.com/plugins/envision-icon-box-block/" rel="nofollow ugc">See Demos</a> 🤝</h4>
Ever find yourself wanting a simple, clean way to showcase features or services on your site? The Icon Box block just for that. It’s a straightforward block for the Gutenberg editor that lets you pair a stylish icon inside a fully customizable box.
Our goal was to make it incredibly flexible without overwhelming you with options. You can build beautiful, professional-looking sections with the Icon Box that fit your site’s look and feel perfectly.
<h4>The Icon Box plugin is for:</h4>
<ul>
<li>
Showcasing Your Core Services: Instead of a boring bulleted list, you can create a visually engaging grid of your company’s services, each with a relevant icon, making it easier for customers to understand what you do at a glance.
</li>
<li>
Highlighting Key Product Features: On a sales or product page, use icon boxes to break down features (e.g., “Long Battery Life” with a battery icon, “Encrypted” with a shield icon) to make them easily scannable and digestible for potential buyers.
</li>
<li>
Creating a “Why Choose Us?” Section: Quickly communicate your main value propositions. Pair an icon with a benefit like “24/7 Support,” “Free Shipping,” or “Expert Team” to build trust and convince visitors.
</li>
<li>
Illustrating a Step-by-Step Process: Visually guide users through a process, such as a “How it Works” section. For example: (1) Sign Up, (2) Create Your Profile, (3) Go Live! Each step is clearer with its own icon.
</li>
<li>
Making Contact Information More Engaging: Organize your phone number, email, and physical address into clean, separate boxes, each with a recognizable icon. It’s much more user-friendly than a simple line of text.
</li>
<li>
Summarizing Key Takeaways in an Article: Break up long blog posts or articles by using icon boxes to summarize the main points or benefits, helping to improve reader engagement and information retention.
</li>
</ul>
Download the Icon Box plugin today and take your website to the next level!
🌟 Unlock More Flexibility! Use the <a href="https://pluginenvision.com/plugins/blocks-to-shortcode/" rel="nofollow ugc">Blocks to ShortCode</a> plugin to **convert any blocks into shortcodes and embed them anywhere! 🚀**
<h4>Icon Box Features</h4>
👉 Display icon from popular libraries: Import the icon from built in font awesome and bootstrap libraries.
👉 Colors: Apply the normal and hover color for the icon.
👉 Size: Apply the icon size as well as the box width and height to match your design.
👉 Alignment: Change the alignment of the icon box to the left, center, or right.
👉 Advanced Options: Set advanced styles/options like padding, margin, background, hover background, border, shadow, transforms, transitions, animate on scroll, and more.
<h4>How to use Icon Box</h4>
<ul>
<li>Begin by installing the Icon Box plugin.</li>
<li>Add the Icon Box block from the Media block category within the Gutenberg Editor.</li>
<li>Customize block settings from the settings sidebar on the right.</li>
<li>
Enjoy!
</li>
<li>
For installation assistance, click on the Installation tab.
</li>
</ul>
<h4>Feedback</h4>
<ul>
<li>Did you find this plugin helpful or have any concerns? Do you have a feature request? <a href="https://pluginenvision.com/contact" title="Send feedback" rel="nofollow ugc">Please share your feedback with us</a></li>
</ul>

Alternatives to Icon Box Block – Insert your favorite icon with customization and design

Top alternatives