Steps

A multi-step indicator to navigate through the stages of a process.

How to

Steps are navigation items that help the user to get oriented in the middle of a multi-stage process.

The component includes some handy custom properties (don't forget to update the --steps-number custom property):

:root {
    --steps-number: 4;
    --step-separator-line-stroke: 3px;
    --step-separator-line-gap: 3px;
    --step-circle-size: 32px;
    --step-circle-font-size: 1em;
}

Categories

• Navigation > Steps

Bug report & feedback

Component Github page ↗