Alert

Alerts can be used to provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages. For an alert, combine the class alert with a contextual color class or a color library class.

Contextual Colors

    Well done! You successfully read this important alert message.

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

    Warning! Better check yourself, you're not looking too good.

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

Color Library

In most cases, you'll probably be using contextual colors for your alerts, but you can also use any class from the color library. Below are just a few examples.

    Hey You! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Hey You! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Hey You! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Hey You! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Links in Alerts

    Well done! You successfully read this important alert message.

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

    Warning! Better check yourself, you're not looking too good.

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