Timeline

Shows progress on a process over time.

  • You have a larger process (such as processing a customer request) broken into steps.
  • Users have no control over the process.
  • You want set user expectations about progress being made.
  • There is a task users should complete and you want to nudge them along the process—use a wizard.
FigmaReactiOSAndroidDocumentation
Designing
Released
n/a
n/a
Released

Type indicator: shows the result of completed steps; label: sets the context for the step and works best when short; sub-label: adds additional context for the step; step content: describes the step in detail.

Each completed step can have one of three results: success, warning, or critical. Use these types to add context for the process.