Variations
Nice Progressbar

Basic Example

Default progress bar.

25%

Animated bars

you can create animated bar if you want just put wow animated progress-animated

60% Complete
60% Complete
60% Complete
60% Complete
60% Complete
60% Complete

Skill Bars

you can create animated skill bar if you want just put wow animated progress-animated

Photoshop85%
60% Complete
Code editor90%
60% Complete
Illustrator65%
60% Complete

Contextual alternatives

Progress bars use some of the same button and alert classes for consistent styles.

Striped example

Uses a gradient to create a striped effect.

Size example

We only set a height value on the .progress, so if you change that value the inner .progress-bar will automatically resize accordingly.

Progressbar Vertical

Use class .progress-vertical.

Progressbar Vertical Bottom

Use class .progress-vertical-bottom.

Jhon Smith

Active

  • 11:11 AM, Today
    Hi Robert , how are you?
  • 11:15 AM, Today
    Fine. and you?
  • 11:16 AM, Today
    Fine. What's about vacation?.
  • 11:18 AM, Today
    We think for next weekend.
    Have fun!
6