Product Features

Layout, content and available controls for Product Features.

Scale Theme · v1.9.3 · 2 min read

Where to find it

Add this section from the theme editor on a supported template.

Available content blocks

Feature Item

Editor controls

Conditional controls appear after choosing the relevant source, style or option. Saved values may differ from new defaults.

Display section ID: ID is used in the Sections group section to create anchor links. Toggle on to show a copy button on this section.
Display on: Choose the presentation or source that fits this component.Options: All devices · Desktop only · Mobile only
Feature layout: Alternating rows use each feature image, then the section image as a fallback.Options: Feature card beside image · Alternating image and feature rows · Centered product with circular benefits
Static top and bottom wavesConditional: Enable or disable this option and preview the result.
Curved benefit arrowsConditional: Enable or disable this option and preview the result.
Center product widthConditional: Adjust within the range offered by the theme editor.
Circular image sizeConditional: Adjust within the range offered by the theme editor.
Feature motionConditional: Choose the presentation or source that fits this component.Options: Static · Reveal on scroll
Alternating image ratioConditional: Choose the presentation or source that fits this component.Options: Square · Landscape · Portrait
Desktop LayoutConditional: Choose the presentation or source that fits this component.Options: Text Left - Image Right · Image Left - Text Right
Container Max Width: Adjust within the range offered by the theme editor.
Color source: Theme colors follow Theme settings > Colors. Other sources apply only to this section.Options: Use theme colors · Choose a color scheme · Set custom colors
Saved color schemeConditional: Choose an available Shopify color scheme.
BackgroundConditional: Choose a local color when the relevant custom source is enabled.
HeadingConditional: Choose a local color when the relevant custom source is enabled.
TextConditional: Choose a local color when the relevant custom source is enabled.
Accent and iconsConditional: Choose a local color when the relevant custom source is enabled.
Card backgroundConditional: Choose a local color when the relevant custom source is enabled.
Card borderConditional: Choose a local color when the relevant custom source is enabled.
Background ColorConditional: Choose a local color when the relevant custom source is enabled.
Background GradientConditional: If set, gradient will override background color
Heading: Use bold or italic in this heading to apply the global Heading DNA accent style. Change it in Theme settings > Typography.
Accent effect: Highlight adds a slanted color plate behind bold or italic heading text. The existing accent color controls set its background.Options: Theme setting · Highlight
Heading accent color source: Global accent styling is managed in Theme settings > Typography; choose Custom for a local color.Options: Heading DNA · Custom
Custom accent colorConditional: Choose a local color when the relevant custom source is enabled.
Accent TextConditional: Edit the text shown by this component.
Heading Weight: Choose the presentation or source that fits this component.Options: Normal · Medium · Semi Bold · Bold
Heading ColorConditional: Choose a local color when the relevant custom source is enabled.
Accent ColorConditional: Choose a local color when the relevant custom source is enabled.
Accent Gradient (Optional)Conditional: If set, gradient will override accent color
Accent Style: Choose the presentation or source that fits this component.Options: Normal · Italic
Subtitle: Use the matching control in the theme editor and preview the component before publishing.
Subtitle Weight: Choose the presentation or source that fits this component.Options: Normal · Medium
Subtitle ColorConditional: Choose a local color when the relevant custom source is enabled.
Feature Image: Choose an image from your shop. Preview its crop on desktop and mobile.
Starter photoConditional: Choose the presentation or source that fits this component.Options: Hero · Detail · Lifestyle · Portrait
Starter image: Uploaded image takes priority over the included demo photo.Options: None · Skincare · Supplement · Matcha · Pet supplement · Shapewear · LED mask · Vacuum
Image Border RadiusConditional: Adjust within the range offered by the theme editor.
Card Background ColorConditional: Choose a local color when the relevant custom source is enabled.
Card Background GradientConditional: If set, gradient will override card background color
Card Border ColorConditional: Choose a local color when the relevant custom source is enabled.
Card Border WidthConditional: Adjust within the range offered by the theme editor.
Card Border StyleConditional: Choose the presentation or source that fits this component.Options: Solid · Dashed · Dotted
Card Border RadiusConditional: Adjust within the range offered by the theme editor.
Card PaddingConditional: Adjust within the range offered by the theme editor.
Gap Between Features: Adjust within the range offered by the theme editor.
Icon SizeConditional: Adjust within the range offered by the theme editor.
Icon ColorConditional: Choose a local color when the relevant custom source is enabled.
Feature Title Size: Adjust within the range offered by the theme editor.
Feature Title Weight: Choose the presentation or source that fits this component.Options: Normal · Medium · Semi Bold · Bold
Feature Title ColorConditional: Choose a local color when the relevant custom source is enabled.
Feature Description Size: Adjust within the range offered by the theme editor.
Feature Description ColorConditional: Choose a local color when the relevant custom source is enabled.
Top Padding: Adjust within the range offered by the theme editor.
Bottom Padding: Adjust within the range offered by the theme editor.