Tag

Compact labels for categories, statuses, or filters. Use tags in lists and chip groups when a short keyword should stand out.

#
Usage

Basic example with common props.

Amber

I'm a tag

I'm a xs tag

I'm a sm tag

I'm a md tag

I'm a lg tag

I'm a xl tag

I'm a veeeeeeeeeeeeeeeeeeeeeeeery long tag

I'm a veeeeeeeeeeeeeeeeeeeeery long tag

I'm a veeeeeeeeeeeeeeeeeeery long tag

Name	Description	Type	Default	Values
size	Control size. One of xs, sm, md, lg, xl.	String	md	xssmmdlgxl
color	Theme or CSS color used for the control accents.	String	secondary
tag	Root element tag. Becomes an anchor or router-link when `href` or `to` is set.	String	span
rounded	Fully rounded corners (pill shape).	Boolean	false
removable	Shows a remove control that emits `remove`.	Boolean	false
outlined	Outline style with a transparent fill.	Boolean	false
filled	Filled style using the theme color.	Boolean	false
disabled	Disables the remove control and applies disabled styling.	Boolean	false
to	Vue Router location; renders as a link when set.	String Object

Name	Description
default	Tag label and content.
prefix	Content shown before the label.

Name	Description
remove	Emitted when the remove icon is clicked.