35% Complete (success)
20% Complete (warning)
10% Complete (danger)
<div class="progress">
    <div class="progress-bar progress-bar-success" style="width: 35%">
      <span class="sr-only">35% Complete (success)</span>
    </div>
    <div class="progress-bar progress-bar-warning" style="width: 20%">
      <span class="sr-only">20% Complete (warning)</span>
    </div>
    <div class="progress-bar progress-bar-danger" style="width: 10%">
      <span class="sr-only">10% Complete (danger)</span>
    </div>
  </div>