Updated 15 October 2024
Chips & badgesView Figma
Chips & badges are used to inform users of a certain status in the UI. They can can have a leading icon and trailing action attached. Badges should be used when there is no interactivity needed.
chip(8 variants)
Our chips come in two sizes. They can have a leading dot and close icon. These are both optional.
Figma notes
If you change the colour, stick to the system used here for background and focus states.
The small size needs custom spacing to make the icons work. Both icons are optional.