Updated 28 January 2025
Contextual
Updated 18 Nov 2024View Figma
A tooltip is a floating, non-actionable label used to explain a user interface element or feature.
chip(8 variants)
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.
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.