We use cookies to offer you a better browsing experience, analyse traffic and personalise content. Read how we use your data in our privacy policy.

Tag & Tag List

Small tag labels to insert anywhere

Features

  • Attach secondary tag
  • Standard and custom text and background colors
  • Three different sizes

  • Rounded Tags
  • Tags can be grouped in Tag Lists

Example

Tag Text
By default, a tag is a 1.5rem high label.

Colors

Black
Dark
Light (Default)
White
Primary
Link
Info
Success
Warning
Danger
There are 10 different colors available.
Additionally, you can select custom colors for the background…
Tag Text
… as well as for the text.
Tag Text

Sizes

There are 3 different sizes available.
Small
Medium
Large

Rounded Tags

You can add the "Rounded" option to make a rounded tag.
Rounded

Secondary Tag

You can attach a secondary tag to the first one.

npm 0.5.0
build passing
chat on gitter

Tag List

Tags can be grouped in Tag Lists

One Two Three
If the list is very long, it will automatically wrap on multiple lines, while keeping all tags evenly spaced.

One Two Three Four Five Six Seven Eight Nine Ten Eleven Twelve Thirteen Fourteen Fifteen Sixteen Sventeen Sixteen Eighteen Nineteen Twenty
If you want to create a list of tags with secondary items, use the "Grouped" option.

Weizen 12°P
Stout available
Pilsener bitter

Extra

Font Set, Style Set and Cust. CSS Class - open up the advanced features of the Font and Style stacks.