What the component handles
- Icons are hidden from screen readers by default aria-hidden="true", as they are accompanying text in most of the cases.
What you need to provide
- alt prop when the icon conveys important information (removes aria-hidden and adds accessible name) e.g. icons next to the user profile name.
Color contrast
Meets the WCAG 2.1 AA color contrast ratio requirements and can be used on the following:
- background.static.xxx tokens except for background.static.on-color
- On background.static.inverse you should use the inverse variant of the Icon,
- in all Card variants,
- in Banner components.