---
title: "Icon box"
description: "The Icon Box element combines an icon with content in a flexible layout."
canonical: "https://academy.bricksbuilder.io/builder/elements/general/icon-box/"
markdownUrl: "https://academy.bricksbuilder.io/builder/elements/general/icon-box.md"
pageType: "article"
section: "builder"
category: "elements"
lastmod: "2026-05-21T13:58:32.000Z"
---
The Icon Box element combines an icon with content in a flexible layout.

## Settings

- **Direction** (direction) - Layout direction of the icon and content.

- **Spacing** (number with units) - Gap between the icon and content.

### Icon

- **Icon** (icon) - The icon to display. Default: WordPress icon from Themify library.

- **Align** (align-items) - Vertical alignment of the icon.

- **Link** (link) - Make the icon clickable with a link.

- **Margin** (spacing) - Margin around the icon.

- **Padding** (spacing) - Padding inside the icon container.

- **Size** (number with units) - Font size of the icon.

- **Height** (number with units) - Height of the icon container.

- **Width** (number with units) - Minimum width of the icon container.

- **Color** (color) - Color of the icon.

- **Background color** (color) - Background color of the icon container.

- **Border** (border) - Border styling for the icon container.

- **Box shadow** (box-shadow) - Shadow effect for the icon container.

### Content

- **Content** (rich text) - The text content to display alongside the icon. Supports rich text and dynamic data.

- **Align** (align-items) - Vertical alignment of the content.

- **Margin** (spacing) - Margin around the content.

- **Padding** (spacing) - Padding inside the content container.

- **Heading typography** (typography) - Font settings for heading elements (h1-h6) in the content.

- **Body typography** (typography) - Font settings for the content text.

- **Background** (color) - Background color of the content container.

- **Border** (border) - Border styling for the content container.

- **Box shadow** (box-shadow) - Shadow effect for the content container.

:::tip[Developer reference]
See the [Icon Box Schema](/developer/schema/elements/icon-box/) for the full JSON schema of this element's settings and controls.
:::