Badge

Badges are elements that represent the status of an object or user input value.

• Appearance: Badges may play various roles in your product and having a predefined colour for each role should help users understand their meaning. When changing colours, make sure the text has enough contrast ratio with the background according to the WCAG AA standard.
• Dismissible Action: Badges can be used as a dynamic way to display selected values and there should be a way to dismiss them.