# Icon row

Allows you to display a row of icons with accompanying headings, perfect for highlighting key features or benefits of your products or services. You can customize each icon’s appearance and text, creating a visually appealing and informative section on your page.

<figure><img src="https://891064830-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fz8oqtXqtdhOM4CxRzekr%2Fuploads%2FMWgGKcNyObBvc6PZ4coZ%2Ficon-row.gif?alt=media&#x26;token=f1cd3379-112c-4391-90a4-a414fc511360" alt=""><figcaption></figcaption></figure>

### How to set up

<table><thead><tr><th width="154.04339599609375">Settings</th><th width="141.439208984375" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Select an icon</td><td align="center"><code>select</code></td><td>Choose an icon (e.g., a truck for shipping, a check for free returns, and others).</td></tr><tr><td>Color</td><td align="center"><code>color</code></td><td>Customize the color of the first icon as well as for each one individually.</td></tr><tr><td>Image</td><td align="center"><code>image_picker</code></td><td>Upload an image to override the selected icon.</td></tr><tr><td>Width</td><td align="center"><code>range</code></td><td>Set the width for the first icon as well as for the others.</td></tr><tr><td>Heading</td><td align="center"><code>text</code></td><td>Add text for the first icon as well as for the others (e.g., 'Free Shipping', 'Free Returns', and others).</td></tr><tr><td>Alignment</td><td align="center"><code>select</code></td><td>Align icons either <code>Left</code> or <code>Center</code>.</td></tr><tr><td>Background color</td><td align="center"><code>color</code></td><td>Set the background color for the entire row of icons.</td></tr><tr><td>Padding bottom</td><td align="center"><code>range</code></td><td>Adjust the padding at the bottom of the icon row block.</td></tr></tbody></table>