Icon grid

Section overview

The Icon Grid section displays a customizable grid of icon cards with headings and descriptive content. It allows for flexible layout options with control over colors, spacing, and responsive behavior.

Common use cases

• Showcase product features or benefits with icons and descriptions

• Display service offerings or company values

• Create a grid of informational content cards with visual elements

• Highlight key selling points or unique value propositions

Usage tips

• Use consistently sized icons (ideally SVGs) for a polished appearance

• Keep headings concise and content brief for better readability

• Consider mobile layout when configuring grid settings - fewer columns on mobile provide better visibility

• Use color schemes that maintain sufficient contrast between icons, text, and backgrounds

Section settings

Setting	Description
Heading	Main section heading text
Content	Rich text content for the section
Button label	Text for the optional button
Button URL	Link destination for the button
Spacing top	Amount of space above the section (in pixels)
Spacing bottom	Amount of space below the section (in pixels)
Color scheme	Background and text color combination for the section
Border color	Color for section borders
Button color	Style and color for the section button
Border position	Position of borders on the section
Row desktop	Number of columns in the grid on desktop devices
Row mobile	Number of columns in the grid on mobile devices
X alignment	Horizontal alignment of content within the section
Visibility	Controls whether section appears on all devices, only mobile, or only desktop

Block settings

Icon

The Icon block creates a card containing an icon, heading, and descriptive text with customizable layout and styling options. Limited to 20 blocks per section.

Setting	Description
Icon	Image to use as the icon (recommended 256px)
Icon height	Size of the icon (small, normal, or large)
Heading	Heading text for this block
Content	Rich text content for this block
Enable padding	Adds padding inside the block
Color scheme	Background and text color combination for this block
Border color	Color for block borders (subtle, strong, or none)
Alignment	Layout direction (horizontal or vertical)
X alignment	Horizontal text alignment (left, center, or right)
Row span	Number of rows this block should span in the grid
Column span	Number of columns this block should span in the grid