Avatar
Icons and/or text that represent users or entities.
Creating access for everyone, everywhere requires attention to accessibility attributes, best practices, and requirements. Find accessibility guidance below.
Note: Components in each code library are implemented differently (especially Flutter). Many of the behaviors and attributes described are already handled for you as part of our components. Product teams are responsible for ensuring their apps meet all current requirements. Some of the information below may not apply to your implementation.
Best practices
Ensure the following best practices are met when implementing this component during development.
- Ensure avatars always have accessible names for screen readers. As mentioned in the usage guidelines they must have accessible names such as
or attributes. In the case of initials, the accessible name should be the full name. - Add
to all avatars that are not placed directly on an . - Reference examples of avatars used in Dropdown menu and Horizontal navigation for more.
Keyboard controls
| Key | Behavior |
|---|---|
| Space or Enter | Prompts buttons. If using |