Skip to content
hightouchUI

Design system

v40.6.0

Progress bar

Progress bar indicates a progress of a long-running action that can be measured or estimated.

Example

Guidelines

When to use

  • When action was performed in the past, prior to user loading the current page.
  • When action is expected to run for a long time and progress can be measured or estimated.

When not to use

  • If action is expected to finish quickly, use a spinner.
  • If you need to display an indication of a progress immediately after user performs an action, use a spinner.

Props

Inherits margin props.

NameDefaultDescription
aria-label

string

Mandatory label for the progress bar. Required for accessibility.

value

number

Progress value, a number between 0 and 100.