Skip to main content

Progress Stepper

A progress stepper visually represents the user's progress and completion status of each step in a process.

Overview

The purpose of progress steppers is to guide users through a series of steps, visually indicating their progress and completion status. It helps users navigate complex processes, maintain a sense of orientation, and ensures a smoother user journey.

Progress steppers are commonly used in multi-step forms, onboarding processes, checkout flows or any situation where a complex task is divided into manageable steps. They enhance the user experience by providing a visual roadmap and aiding in task completion.

A progress stepper that displays different steps of a flow.

Resources

Stable
Stable
Web Components
Planned
Vue [Fozzie]
N/A
React [Snacks]
N/A
iOS JustUI [UI Kit]
N/A
iOS PIE [SwiftUI]
N/A
Android PIE [Compose & Views]
TBC