Use the .badge
class, followed by.badge-secondary
class within element to create
secondary badge.
Use the .badge
class, followed by.badge-primary
class within element to create
primary badge.
Use the .badge
class, followed by.badge-success
class within element to create
success badge.
Use the .badge
class, followed by.badge-danger
class within element to create
danger badge.
Use the .badge
class, followed by.badge-info
class within element to create info
badge.
Use the .badge
class, followed by.badge-warning
class within element to create
warning badge.
Use class .badge-square
with .badge
to make your badge square
Use <a>
tag inside your .badge
to create a badge with
icon
Use .dropdown-toggle
class with your badge text to create a badge with
dropdown
Add icon before your dropdown toggle text to create a dropdown toggle with icon
Use .block
class with .badge
, to display badge as a block
element.
Add your icon inside <a>
tag class to make your block badge a link
Use classes badge-{xl|lg|md|sm}
to change size of a badge