Progress Bars

Progress Bars

Custom styling Progress Bar options.

basic example
60% Complete

with label
60%

0%

2%

striped
40% Complete (success)

20% Complete

60% Complete (warning)

80% Complete (danger)

contextual alternatives
40% Complete (success)

20% Complete

60% Complete (warning)

80% Complete (danger)

stacked
35% Complete (success)
20% Complete (warning)
10% Complete (danger)

65% Complete (success)
20% Complete (warning)
10% Complete (danger)

55% Complete (success)
70% Complete (warning)
40% Complete (danger)

animated
75% Complete

65% Complete

25% Complete

35% Complete

Oh hi there đź‘‹
It’s nice to meet you.

Sign up to receive awesome content in your inbox, every month.

We don’t spam! Read our privacy policy for more info.