Default

A simple labeling component. Badges scale to match the size of the immediate parent element by using relative font sizing and em units.

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New
Example heading New

Pill Badges

Use the .rounded-pill modifier class to make badges more rounded.

Primary Secondary Success Danger Warning Info Light Dark
Lighten Badges

Use the .bg-*-subtle text-* modifier class to make badges lighten.

Primary Secondary Success Danger Warning Info Dark
Outline Badges

Using the .badge-outline-* to quickly create a bordered badges.

Primary Secondary Success Danger Warning Info Dark

Badge Positioned

Use utilities to modify a .badge and position it in the corner of a link or button.

Buttons

Positioned

© Techmin - Theme by Techzaa
Theme Settings
Color Scheme
Layout Mode
Topbar Color
Menu Color
Layout Position