Progress Bar

Progress bars have been proven to drive users to complete processes.

Basic Progress Bar

50%
<div class="ss-bg-light-gray">
  <div class="ss-container ss-bg-brand ss-white ss-w-5">
    50%
  </div>
</div>

Rounded Progress Bar

Use the ss-round(-*|) classes to add rounded corners to a progress bar.

50%
<div class="ss-bg-light-gray ss-round">
  <div class="ss-container ss-bg-brand ss-white ss-w-5 ss-round">
    50%
  </div>
</div>