Three to five steps in a single row, on one continuous line with a marker on each. In narrow containers the same line runs down the left as a vertical list.
Light · Dark
Steps
A picture on one side that stays in view while three to six numbered steps run down the other. Use when one screenshot explains the whole flow.
Light · Dark
Numbered steps as cards in a row or as a list. A step may carry a copyable code block or a reference chip.
Light · Dark
A vertical timeline of labelled steps with a connecting line. Process, onboarding or roadmap.
Light · Dark