Icon Features

Icon features displays a grid of short feature items with icons.

Configure Icon Features

1. Add Icon features.
2. Add a heading and intro text.
3. Set desktop and mobile columns.
4. Add Feature blocks.
5. Add SVG code or upload an icon image for each block.
6. Add title and text.
7. Save.

Use this section for benefits, services, materials, guarantees, or store values.

Section Settings

• Color scheme: Sets the section background and text colors.
• Heading: Section heading. Example: Why customers choose us , Materials , Services , or What makes it different .
• Heading tag: Sets the HTML heading level. Use H2 for most page sections.
• Intro text: Optional text below the heading. Use this to introduce the group before the individual feature blocks.
• Columns on desktop: Controls how many feature blocks appear in each row on desktop. Use more columns for short items and fewer columns for longer text.
• Columns on mobile: Controls whether features appear as one or two columns on mobile. Use one column when text is longer; use two columns for short icon labels.

Spacing is controlled using the shared padding settings. See Section Spacing and Padding.

Feature Block

• Icon SVG code: Paste inline SVG code for a crisp, scalable icon. This is useful if you have custom brand icons.
• Icon image: Upload an image icon instead of using SVG code. Use this if you do not have SVG code.
• Icon image width: Controls the display width of the uploaded icon image.
• Title: The feature name. Example: Made locally , Solid timber , or Free returns .
• Text: Short supporting text that explains the feature.

Tips

• Use either SVG code or an uploaded icon image, not both.
• Keep feature text to one or two short sentences.