Provide up-to-date feedback on the progress of a workflow or action with simple yet flexible progress bars.

Description Render
Default progress bar
0% complete
progress:0[]
100% complete
progress:100[]
Labels
with only percent value
60%
progress:60[caption="60%"]
with a custom text
other text label, at 75%
progress:75[caption="other text label, at 75%"]
Contextual alternatives
with info class
40% complete
progress:40[role="info",caption="40% complete"]
with success class
50% complete
progress:50[role="success",caption="50% complete"]
with warning class
60% complete
progress:60[role="warning",caption="60% complete"]
with danger class
70% complete
progress:70[role="danger",caption="70% complete"]
Striped effect, without label
without contextual class
progress:45[striped=""]
with contextual warning class
progress:65[role="warning",striped=""]
animated
progress:72[role="info",striped="",animated=""]
Stacked progress bar is not supported.