Status
The status of the component
Component checklist
Ready for use!
Figma component
A link to the Figma library where the component lives.
Repository
A link to the repo where the component lives.
Usage
Use proper label and type colors
Do
Use the appropriate light/dark type color style that will yield the most contrast between the label and tag background.
Don't
Avoid enforcing the same type, color and style between colored tags. Some label + background combinations will fail in accessibility due to lack of contrast.
Keep to defined usage
Do
As a component, tags can be interacted with and therefore have specific use cases around them.
Don't
Tags do not replace highlighting, labels, statuses, and other non-interactive text decorations.