Bootstrap 4 Tags
Append and highlight additional information to a string of text with a stylized tag.
Bootstrap's tag classes can be used to highlight additional information that's appended to a string of text.
To create a tag, apply the .tag
class, as well as one of the .tag-*
classes to the <span>
element that represents the tag.
Example
Here we create a default tag by using class="tag tag-default"
.
Contextual Classes
The following contextual classes are available for tags.
Pill Tags
Make the corners more rounded with Bootstrap's .tag-pill
class.
New in Bootstrap 4
- Bootstrap 4 replaced labels with tags.
- Bootstrap 4 introduced the
.tag-pill
class to provide rounded corners.
- Bootstrap 3 doesn't have the
.tag
class. It uses labels, and badges (both of which were dropped in Bootstrap 4).