Basic Progress

Basic progress in diffrent color backgrounds. Add .bg-* modifier class to change the color. Use Bootstrap width utilities for setting the width of a progress bar.

Rounded Progress

Create rounded progress using .progress .progress-bar-rounded class.

Striped Progress

Add .progress-bar-striped to any .progress-bar to apply a stripe via CSS gradient over the progress bar’s background color. Add .progress-bar-animated to .progress-bar to animate the stripes right to left via CSS3 animations.

Progress sizes

Size whatever you want just add .progress-xs, sm, md, lg, xl or you can just add height utility classes.

Progress with labels

Add labels on top of your progress bars by placing text within the .progress-label inside .progress-lb-wrap and for label left add class .lb-side-left with .progress-wrap .

Labels on top

Multiple Bars

Include multiple progress bars in a progress component if you need.