Progress Bars
Size Options
Bootstrap 92%
CoffeeScript 68%
HTML/CSS 78%
<h3 class="progress-label">Bootstrap<span class="pull-right">92%</span></h3>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-primary"role="progressbar" aria-valuenow="92" aria-valuemin="0" aria-valuemax="100" style="width:92%"></div>
</div>Bootstrap 92%
CoffeeScript 68%
HTML/CSS 78%
<h3 class="progress-label">Bootstrap<span class="pull-right">92%</span></h3>
<div class="progress progress-xs">
<div class="progress-bar progress-bar-primary"role="progressbar" aria-valuenow="92" aria-valuemin="0" aria-valuemax="100" style="width:92%"></div>
</div>Bootstrap 92%
CoffeeScript 68%
HTML/CSS 78%
<h3 class="progress-label">Bootstrap<span class="pull-right">92%</span></h3>
<div class="progress progress-sm">
<div class="progress-bar progress-bar-primary"role="progressbar" aria-valuenow="92" aria-valuemin="0" aria-valuemax="100" style="width:92%"></div>
</div>Bootstrap 92%
CoffeeScript 68%
HTML/CSS 78%
<h3 class="progress-label">Bootstrap<span class="pull-right">92%</span></h3>
<div class="progress">
<div class="progress-bar progress-bar-primary"role="progressbar" aria-valuenow="92" aria-valuemin="0" aria-valuemax="100" style="width:92%"></div>
</div>Color Options
Red92%
Blue68%
Green78%
Aqua78%
Yellow92%
Brown68%
Violet78%
Orange78%
Default Progress Bar
<div class="progress">
<div class="progress-bar progress-bar-success"role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"style="width:90%;"></div>
</div>Striped Progress Bar
<div class="progress progress-striped">
<div class="progress-bar progress-bar-success"role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"style="width:90%;"></div>
</div>Animated Progress Bar
<div class="progress progress-striped active">
<div class="progress-bar progress-bar-success"role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"style="width:90%;"></div>
</div>Stacked Progress Bar
<div class="progress">
<div class="progress-bar progress-bar-success"role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"style="width:90%;"></div>
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"style="width:30%;"></div>
</div>