Design
Options
There are 4 options for toasts and to apply them simply add one of the following classes: .toast-success, .toast-info, .toast-warning or .toast-danger.
<div class="toast toast-success" role="alert">
<strong>Well done!</strong> You successfully read this important alert message.
</div>
<div class="toast toast-info" role="alert">
<strong>Heads up!</strong> This alert needs your attention, but it's not super important.
</div>
<div class="toast toast-warning" role="alert">
<strong>Warning!</strong> Better check yourself, you're not looking too good.
</div>
<div class="toast toast-danger" role="alert">
<strong>Oh snap!</strong> Change a few things up and try submitting again.
</div>