A representation of a user’s progress through a series of discrete steps.
Component
Progress indicator
Other names: Progress tracker, Stepper, Steps, Meter
36 examples
Steps
Ant Design
Ant Financial
- React
- Code examples
- Accessibility issues
Progress indicator
Atlassian Design System
- React
- Code examples
- Usage guidelines
- Tone of voice
- Accessibility
- Open source
Progress tracker
Atlassian Design System
- React
- Code examples
- Usage guidelines
- Tone of voice
- Accessibility
- Open source
Progress Indicator
Aurora
Government of Canada
- CSS
- Code examples
- Tone of voice
- Open source
Progress indicator
Australian Government Design System
- React
- Sass
- Usage guidelines
- Code examples
- Accessibility
- Open source
Progress
Backpack
Skyscanner
- Mobile
- React
- Code examples
- Usage guidelines
- Open source
- Tone of voice
Progress Steps
Base Web
Uber
- React
- CSS-in-JS
- Code examples
- Usage guidelines
- Open source
Progress indicator
Carbon Design System
IBM
- React
- Vanilla JS
- Angular
- Vue
- Svelte
- Code examples
- Usage guidelines
- Open source
Stepper
Coral
Talend
- React
- Code examples
- Tone of voice
Multi-step wizard
Edison Design System
General Electric
- Web Components
- Usage guidelines
- Code examples
Progress indicator
Edison Design System
General Electric
- Web Components
- Usage guidelines
- Code examples
Steps
Elastic UI framework
Elastic
- React
- Sass
- Code examples
- Open source
Stepper
Elisa Design System
- React
- Usage guidelines
- Code examples
- Accessibility
Progress
Goldman Sachs Design System
- Tone of voice
- Usage guidelines
Steps
Goldman Sachs Design System
- Tone of voice
- Usage guidelines
Progress
Instructure-UI
Instructure
- React
- CSS-in-JS
- Code examples
- Accessibility
- Open source
ProgressBar
Instructure-UI
Instructure
- React
- CSS-in-JS
- Code examples
- Accessibility
- Open source
ProgressCircle
Instructure-UI
Instructure
- React
- CSS-in-JS
- Code examples
- Accessibility
- Open source
Path
Lightning Design System
Salesforce
- React
- Code examples
- Usage guidelines
- Tone of voice
- Open source
Progress Indicator
Lightning Design System
Salesforce
- React
- Code examples
- Usage guidelines
- Tone of voice
- Open source
Stepper
Momentum Design
Cisco
- React
- Sass
- Code examples
- Usage guidelines
- Open source
Progress
Nucleus Design System
British Gas
- Web Components
- Usage guidelines
Timeline
Orbit
Kiwi.com
- React
- CSS-in-JS
- Usage guidelines
- Open source
- Code examples
- Tone of voice
Progress indicator
Oxygen
Repsol
- HTML
- Code examples
- Usage guidelines
Stepper
Quasar Framework
- Vue
- Accessibility issues
- Code examples
Progress Radial
Ruter Components
- React
- Code examples
Progress ring
Shoelace
- Web Components
- Code examples
- Open source
Progress Tracker
Solar Design System
Bulb
- Code examples
- Usage guidelines
- Research
- Tone of voice
Steps to complete
Solar Design System
Bulb
- Code examples
- Usage guidelines
- Research
- Tone of voice
Stepper
Spark Design System
Quicken Loans
- React
- Angular
- Code examples
- Usage guidelines
- Open source
Meter
Spectrum
Adobe
- CSS
- Web Components
- React
- Code examples
- Usage guidelines
- Tone of voice
- Open source
Progress Navigation
uStyle
uSwitch
- Sass
- Tone of voice
- Code examples
- Usage guidelines
- Open source
Horizontal steppers
Vattenfall Design System
- HTML
- jQuery
- Sass
- Code examples
- Open source
Progress indicator
W3C design system
- Sass
- Vanilla JS
- Code examples
- Usage guidelines
- Open source
- Accessibility
Progress indicator
West Midlands Network Design System
- HTML
- Nunjucks
- Sass
- Code examples
- Usage guidelines
- Open source