Step · How To / Steps Guide

Where to find it

Editor controls

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

Step Text

Edit the text shown by this component.

Show Marker

Enable or disable this option and preview the result.

Show Circle Background

Turn off for icon-only (e.g., + icon without circle)

Marker Type

Choose the presentation or source that fits this component.Options: Auto Number (1, 2, 3...) · Custom Text / Label · Google Material Icon · Custom SVG

Custom Label

Used when Marker Type is Custom Text (e.g., A, B, •, ✓)

Google Icon Name

Used when Marker Type is Google Icon (e.g., check, add, star, bolt)

Custom SVG Code

Used when Marker Type is Custom SVG. Paste full ... code

Circle Size

Adjust within the range offered by the theme editor.

Circle BackgroundConditional

Choose a local color when the relevant custom source is enabled.

Number ColorConditional

Choose a local color when the relevant custom source is enabled.

Number Font Size

Adjust within the range offered by the theme editor.

Number Font Weight

Choose the presentation or source that fits this component.Options: Normal · Medium · Semi Bold · Bold

Text Font Size

Adjust within the range offered by the theme editor.

Text Font Weight

Choose the presentation or source that fits this component.Options: Normal · Medium · Semi Bold

Text Line Height

Edit the text shown by this component.

Text ColorConditional

Choose a local color when the relevant custom source is enabled.

Number-Text Gap

Adjust within the range offered by the theme editor.

Gap Between Steps

Adjust within the range offered by the theme editor.

Group Top Spacing

Adjust within the range offered by the theme editor.

Group Bottom Spacing

Adjust within the range offered by the theme editor.