Alert

An alert displays a short, important message in a way that attracts the user's attention without interrupting the user's task.

Simple Alert

Simple Alerts can be created in following format by adding alert class to a container which will include an icon and a alert message.

This is a danger alert—check it out!

This is a warning alert—check it out!

This is a success alert—check it out!

This is a info alert—check it out!

Outline Alert

Outline Alerts can be created by adding outline-variant name to the alert container.

This is a danger alert—check it out!

This is a warning alert—check it out!

This is a success alert—check it out!

This is a info alert—check it out!

Cancel Alert

Cancel Alert can be created by adding an extra icon with class cancel-btn on it.

This is a danger alert—check it out!

This is a warning alert—check it out!