Adminage - Admin Dashboard

Alerts are available for any length of text, as well as an optional close button. For proper styling, use one of the eight required contextual classes (e.g., .alert-success ).

A simple primary alert—check it out!

A simple secondary alert—check it out!

A simple success alert—check it out!

A simple danger alert—check it out!

A simple warning alert—check it out!

A simple info alert—check it out!

A simple light alert—check it out!

A simple dark alert—check it out!

Use the .alert-link utility class to quickly provide matching colored links within any alert.

A simple primary alert with demo link. Give it a click.

A simple secondary alert with demo link. Give it a click.

A simple success alert with demo link. Give it a click.

A simple danger alert with demo link. Give it a click.

A simple warning alert with demo link. Give it a click.

A simple info alert with demo link. Give it a click.

A simple light alert with demo link. Give it a click.

A simple dark alert with demo link. Give it a click.

Alerts can also contain additional HTML elements like headings, paragraphs and dividers.

Well done!

Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.

Whenever you need to, be sure to use margin utilities to keep things nice and tidy.

Similarly, you can use flexbox utilities and Bootstrap Icons to create alerts with icons. Depending on your icons and content, you may want to add more utilities or custom styles.

An example alert with an icon

Need more than one icon for your alerts? Consider using more Bootstrap Icons and making a local SVG sprite like so to easily reference the same icons repeatedly.

An example alert with an icon

An example success alert with an icon

An example warning alert with an icon

An example danger alert with an icon

Using the alert JavaScript plugin, it’s possible to dismiss any alert inline

Holy guacamole! You should check in on some of those fields below.

Alerts

Link color

Additional content

Well done!

Icons

more Icons

Dismissing