You can now create a list of tags with the .tags container.
--- title: Tags layout: documentation doc-tab: elements doc-subtab: tag variables: - name: $tag-background-color value: background - name: $tag-color value: text --- {% capture tag %} Tag label {% endcapture %} {% capture tags_colors %} Black Dark Light White Primary Info Success Warning Danger {% endcapture %} {% capture sizes %} Medium Large {% endcapture %} {% capture rounded %} Rounded {% endcapture %} {% capture delete %} Bar Hello World {% endcapture %} {% capture is_delete %} {% endcapture %} {% capture tags %}
{% endcapture %} {% capture tags_multiple %} {% endcapture %} {% capture tags_addons %} {% endcapture %} {% capture tags_field_addons %}Black
Dark
Light
White
Primary
Info
Success
Warning
DangerMedium
Large
is-rounded modifier to make a rounded tag.
is-delete modifier to turn the tag into a delete button.
Bar
Hello
World
You can now create a list of tags with the .tags container.
If the list is very long, it will automatically wrap on multiple lines, while keeping all tags evenly spaced.
You can attach tags together with the .has-addons modifier.
You can attach a text tag with a delete tag together.
If you want to attach .tags containers together, simply use the .field element with the .is-grouped and .is-grouped-multiline modifiers.
This can be useful for a long list of blog tags.