Tour

- Persian new

Pages
- Dashboard
- Dark Dashboard
- Login
- Login Colored

Customize
- Color
- Typography
- Dark Mode
- Rtl
- SideBar

Element

- Animation
- Icon

Base Component 9
- alert
- Badge
- Breadcrumb
- Button
- Card
- Collapse
- Input
- Jumborton
- Pagination
- Progress

Extra Component
- Modal
- Toast
- Widget
- Chart

support

- GitHub
- Submit Issue
- Help

donate

- Buy me a coffee

# Alert

Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages.
"You have to add mentions classes to bootstrap alert."

#### Static Color Alert

###### alert alert-shade alert-*

alert-first! use the alert-first for this result.
alert-second! use the alert-second for this result.
alert-third! use the alert-third for this result.
alert-forth! use the alert-forth for this result.
alert-primary! use the alert-primary for this result.
alert-secondary! use the alert-secondary for this result.
alert-success! use the alert-success for this result.
alert-danger! use the alert-danger for this result.
alert-warning! use the alert-warning for this result.
alert-info! use the alert-info for this result.
alert-light! use the alert-light for this result.
alert-dark! use the alert-dark for this result.

#### 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.

use the alert-success for this result.

#### Dark Mode Support Alert

###### alert alert-shade-white bd-side alert-*

alert-primary! use the alert-primary for this result.
alert-secondary! use the alert-secondary for this result.
alert-success! use the alert-success for this result.
alert-danger! use the alert-danger for this result.
alert-warning! use the alert-warning for this result.
alert-info! use the alert-info for this result.
alert-light! use the alert-light for this result.
alert-dark! use the alert-dark for this result.

#### 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.

use the alert-success for this result.