Label

Use tags to label, categorize, or organize items using keywords that describe them.

Multiple or single tags can be used to categorize items.

Use short labels for easy scanning. Use two words only if necessary to describe the status and differentiate it from other tags.

Default text style: Uppercase

Border radius: Interactive

Colours

Active Active Active

Sizes

xsmall (default) twoxsmall

Label with Icons

Left Icon Right Icon Both Icons
Left Icon Right Icon Both Icons

Letter cases

Uppercase (default) Lowercase
Props
Name Type Required Default Description
size xsmall | small | medium | large | xlarge false medium Size of Button
left_icon string false - Asset name for the left icon
right_icon string false - Asset name for the right icon
color string false gohan.100 Asset name for the icon. Icon only and no text shown
background_color string false bulma.100 Active state
is_uppercase boolean false true Letter case