Alerts are simple colored containers with opinionated type hierarchy. These are great for drawing attention within content or showing the user notices above the page. Alerts styles are reused for showing growls.

Attention

You need to change your password

Careful!

Last command did not work

Please try again.

Please accept the terms and conditions agreement

<div class="alert">
  <h1>Attention</h1>
  <p>You need to change your password</p>
  <button class="button">Change Password</button>
</div>


.alert {
  @include alert();
}
.button {
  @include button();
}