logo-icon logo2
  • Dashboard
    • Ecommerce
    • Analytics new
  • App
    • Chat
    • Contacts
    • Team
    • Calendar
  • UI Components
    • Alert
    • Badge
    • Breadcrumb
    • Button Default
    • Button Dropdown
    • Button Group
    • Button Social
    • Button Loading
    • Card
    • Carousel
    • Collapse
    • List Group
    • Modal
    • Pagination
    • Popover & Tooltip
    • Progress Bar
    • Spinner
    • Switcher
    • Tab
  • Icons
    • Material Icon
    • Flag Icon
  • Forms
    • Basic Input
    • Input Group
    • Checkbox & Radio
    • Form Validation
    • Form Advance
  • Tables
    • Basic Tables
  • Plugins
  • Maps
    • Google Map
  • Widgets
    • General Widget
    • Chart Widget
  • Charts
    • Chart JS
  • Pages
    • User Profile
    • Authentication
      • Sign In
      • Sign Up
    • Others
      • Invoice
      • 404 Page
  • Documentation
    • Getting Started
    • Introduction
    • Quick Start
    • Customization
    • Header Variations
      • Header Light
      • Header Dark
    • Sidebar Variations
      • Sidebar Expend
      • Sidebar Minified
      • Sidebar Offcanvas
  • User Image
    Jhon Smith jhonSmith@gmail.com
  • My Profile
  • Message
  • Projects
  • Setting
  • Log Out
  • 17
logo
  • Forms
    • Basic Input
    • Input Groupl
    • Checkbox & Radio
    • Form Validation
    • Form Advance
  • Calender
  • Chat
  • Contacts
    • User Image
      Jhon Smith jhonSmith@gmail.com
    • My Profile
    • Message
    • Projects
    • Setting
    • Log Out
  • Morbi leo risus
  • Dapibus ac facilisis in
  • Porta ac consectetur ac
  • Vestibulum at eros
    • You have 5 notifications
    • New user registered 10 AM
    • User deleted 07 AM
    • Sales report is ready 12 PM
    • New client 10 AM
    • Server overloaded 05 AM
    • View All
    • User Image
      Jhon Smith jhonSmith@gmail.com
    • My Profile
    • Message
    • Projects
    • Setting
    • Log Out

Alert

  1. components
  2. alert

Default Alerts

  • Action
  • Another action
  • Something else here

Alerts provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages. Read bootstrap documentaion for more details.

This is a primary alert—check it out!
This is a secondary alert—check it out!
This is a success alert—check it out!
A simple danger alert—check it out!
This is a warning alert—check it out!
This is a info alert—check it out!
This is a light alert—check it out!
This is a dark alert—check it out!

Icon Alerts

  • Action
  • Another action
  • Something else here

For icon alert add <i class="mdi mdi-alert me-1"></i> inside < div class="alert" role="alert"> . Get classes for material icon here.

This is a primary alert—check it out!
This is a secondary alert—check it out!
This is a success alert—check it out!
This is a danger alert—check it out!
This is a warning alert—check it out!
This is a info alert—check it out!
This is a light alert—check it out!
This is a dark alert—check it out!

Dismissible Alerts

  • Action
  • Another action
  • Something else here

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

This is a primary alert—check it out
This is a secondary alert—check it out
This is a success alert—check it out
This is a danger alert—check it out
This is a warning alert—check it out
This is a info alert—check it out
This is a light alert—check it out
This is a dark alert—check it out

Heightlighted Alerts

  • Action
  • Another action
  • Something else here

For Heightlighted Alert add class .alert-highlighted to <div class="alert" role="alert">

This is a primary alert—check it out!
This is a secondary alert—check it out!
This is a success alert—check it out!
This is a danger alert—check it out!
This is a warning alert—check it out!
This is a info alert—check it out!
This is a light alert—check it out!
This is a dark alert—check it out!

Dismissing Outline Alerts

  • Action
  • Another action
  • Something else here

For outline Alert add class .alert-outlined to < div class="alert" role="alert">

This is a primary alert—check it out
This is a secondary alert—check it out
This is a success alert—check it out
This is a danger alert—check it out
This is a warning alert—check it out
This is a info alert—check it out
This is a light alert—check it out
This is a dark alert—check it out

© 2026 Copyright Lukee Dashboard Bootstrap Template by Abdus

Modal Title
We'll never share your email with anyone else.