Warning!

Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

Danger!

Oh snap! Change a few things up and try submitting again.

Success!

Well done! You successfully read this important alert message.

Info!

Heads up! This alert needs your attention, but it's not super important.
Danger

I am a very simple card. I am good at containing small bits of information. I am convenient because I require little markup to use effectively.

Success

I am a very simple card. I am good at containing small bits of information. I am convenient because I require little markup to use effectively.

Info

I am a very simple card. I am good at containing small bits of information. I am convenient because I require little markup to use effectively.

Modals
Popovers
Tooltips
Default labels
Default Success Warning Danger Info
Default badges
12
Color labels
pink label red label purple label indigo label blue label light-blue label cyan label teal label green label light-green label lime label yellow label amber label orange label deep-orange label
Color badges
pink badge red badge purple badge indigo badge blue badge light-blue badge cyan badge teal badge green badge light-green badge lime badge yellow badge amber badge orange badge deep-orange badge

Progess bars

Progress bars from bootstrap come in 5 different colors.


Misc bars

You can stack different colors as part of a total progress bar.


Animated bars

Progress bars can be animated by adding a simple active class.