Product highlight cards
Placement and available controls for the Product highlight cards block.
Where to find it
Open the parent section and use Add block where this block is offered.
Editor controls
Conditional controls appear after choosing the relevant source, style or option. Saved values may differ from new defaults.
- Color source
- Theme colors use Color DNA, Color scheme uses a shared Shopify preset, and Custom affects only this block.
- Color schemeConditional
- Choose an available Shopify color scheme.
- Card backgroundConditional
- Choose a local color when the relevant custom source is enabled.
- Card textConditional
- Choose a local color when the relevant custom source is enabled.
- Title and iconConditional
- Choose a local color when the relevant custom source is enabled.
- Card borderConditional
- Choose a local color when the relevant custom source is enabled.
- Card background
- Choose a local color when the relevant custom source is enabled.
- Card text color
- Choose a local color when the relevant custom source is enabled.
- Card accent color
- Choose a local color when the relevant custom source is enabled.
- Border color
- Choose a local color when the relevant custom source is enabled.
- Desktop columns
- Choose the presentation or source that fits this component.
- Mobile columns
- Choose the presentation or source that fits this component.
- Gap
- Adjust within the range offered by the theme editor.
- Mobile gap
- Adjust within the range offered by the theme editor.
- Icon and text gap
- Adjust within the range offered by the theme editor.
- Mobile icon and text gap
- Adjust within the range offered by the theme editor.
- Card radius
- Adjust within the range offered by the theme editor.
- Vertical padding
- Adjust within the range offered by the theme editor.
- Horizontal padding
- Adjust within the range offered by the theme editor.
- Mobile vertical padding
- Adjust within the range offered by the theme editor.
- Mobile horizontal padding
- Adjust within the range offered by the theme editor.
- Card min height
- Adjust within the range offered by the theme editor.
- Mobile card min height
- Adjust within the range offered by the theme editor.
- Border width
- Adjust within the range offered by the theme editor.
- Show shadow
- Enable or disable this option and preview the result.
- Icon size
- Adjust within the range offered by the theme editor.
- Mobile icon size
- Adjust within the range offered by the theme editor.
- Title size
- Adjust within the range offered by the theme editor.
- Mobile title size
- Adjust within the range offered by the theme editor.
- Title weight
- Choose the presentation or source that fits this component.
- Subtitle size
- Adjust within the range offered by the theme editor.
- Mobile subtitle size
- Adjust within the range offered by the theme editor.
- Mobile subtitle lines
- Adjust within the range offered by the theme editor.
- Subtitle weight
- Choose the presentation or source that fits this component.
- Subtitle top spacing
- Adjust within the range offered by the theme editor.
- Top margin
- Adjust within the range offered by the theme editor.
- Bottom margin
- Adjust within the range offered by the theme editor.
- Mobile top margin
- Adjust within the range offered by the theme editor.
- Mobile bottom margin
- Adjust within the range offered by the theme editor.