The Tag component can quickly display tags on, for example, a detail page. An optional delete button can be added which can be configured using Actions.

Adding a tag

To add the Tag component, you can click Basic > Tag.

By default the Tag component is full with, but when you add them it to a Container, set the Direction setting to Row and Horizontal Align to Left or Right it will look like the screenshot above.

Customizing the tag

To customize the tag, you have several settings in the Settings Panel you can use.

Setting	Description
Size	The size of text, choose between small, medium or large.
Color	Choose the color of the button, the text color will change accordingly.
Show Delete Icon	Will add a `X` to the tag which is clickable
On click delete icon	This setting will appear when the `Show Delete Icon` setting is checked. This will allow you to configure what happens when the user clicks the `X` using Actions.