Image with Icon Box Grid
Figma Component: 22266-137902
Last modified with commit a4d1bec on
by Sara Deric.
The Image with Icon Box Grid component displays a grid of icon boxes with optional featured image. Image can be positioned at the top, center, or omitted entirely, with icon boxes arranged in a grid layout.
Functional Documentation
| Role | Scenario | Description |
|---|---|---|
| system | Display layout | Shows icon boxes in grid layout. If image is included, it appears at top or center position based on selected variant. Without image, icon boxes fill the full width. |
| system | Display icon boxes | Each icon box shows icon, heading, and description in compact format within grid. |
| editor | Select layout variant | Choose layout with image at top, image at center, or no image. Featured image is optional. |
| editor | Add and configure icon boxes | Each box requires icon selection, heading, and description. The system limits the number of boxes based on layout - either 3/6 boxes (displays as 1/2 rows) or 4/8 boxes (displays as 1/2 rows). Boxes can be reordered within the allowed limit. |
| user | View content |
Properties
Responsive (Variant)
| Value | Example |
|---|---|
| Desktop |  |
| Mobile |  |
Layout
| Value | Example |
|---|---|
| Image top | |
| Image center |  |
| No image |  |