Alerts

Basic Alerts

Alerts are available for any length of text, as well as an optional dismiss button. Add .alert.alert-COLOR classes for alert with all theme colors.

Primary Alert
Secondary Alert
Success Alert
Danger Alert
Warning Alert
Info Alert
Light Alert
Dark Alert

Alerts with Links

Add .alert-link class to add links to alerts.

Primary Alert
Secondary Alert
Success Alert
Danger Alert
Warning Alert
Info Alert
Light Alert
Dark Alert

Alerts with Additional Content

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

Primary Alert
No Border Success Alert
Solid Danger Alert
Warning Alert
No Border Info Alert
Solid Custom Alert

Dismissible Alerts

Add a dismiss button and the .alert-dismissible class, which adds extra padding to the right of the alert and positions the .close button.

Primary Alert
Secondary Alert
Success Alert
Danger Alert
Warning Alert
Info Alert
Light Alert
Dark Alert

Round Alerts with icons

To use round alert, add class .round to .alert container class. To use Icons, add class .alert-icon-left or alert-icon-right to .alert container class.

Primary Alert
Secondary Alert
Success Alert
Danger Alert
Warning Alert
Info Alert
light Alert
Custom Alert
Navbar Color Options

Layout Options

Sidebar menu Background


Sidebar Background Image
background image
background image
background image
background image