Progressbar

Documentation and examples for using Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels.

Default Progress Bars

Default bootstrap style.

Backgrounds

Add `bg-primary`, `.bg-danger`, `.bg-info` to change progress bar style

Label

Add labels to your progress bars by placing text within the `.progress-bar`.

25%

Label on top

Add text on top progress.

Loading 25%

Multiple Bar

Add `.progress-stacked` to create a single stacked progress bar.

Striped Bar

Add `.progress-bar-striped` to any `.progress-bar` to apply a stripe via CSS gradient over the progress bar’s background color.

Animated Striped Bar

The striped gradient can also be `animated.` Add `.progress-bar-animated` to `.progress-bar` to animate the stripes right to left via CSS3 animations.