Badge
Heading
Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages. Alerts are available for any length of text, as well as an optional dismiss button.
h1.Example heading New
h2.Example heading New
h3.Example heading New
h4.Example heading New
h5.Example heading New
h6.Example heading New
Outline & Outline Pill Badges
Using the .badge-outline-** to quickly create a bordered badges.
Soft & Soft Pill Badges
Using the .badge-soft-** modifier class, you can have more soften variation.
Default & Pill Badges
Use our background utility classes to quickly change the appearance of a badge.
And use the .rounded-pill class to make badges more rounded.
Buttons & Position
Alerts can also contain additional HTML elements like headings, paragraphs and dividers.