Defines the name of the UI5 Icon, that will be displayed. Note: If image slot is provided, the property will be ignored. Note: You should import the desired icon first, then use its name as "icon". import "@ui5/webcomponents-icons/dist/{icon_name}.js" <ui5-avatar icon="employee"> Note: If no icon or an empty one is provided, by default the "employee" icon should be displayed. See all the available icons in the Icon Explorer.
Defines the name of the fallback icon, which should be displayed in the following cases: - If the initials are not valid (more than 3 letters, unsupported languages or empty initials). - If there are three initials and they do not fit in the shape (e.g. WWW for some of the sizes). - If the image src is wrong. Note: If not set, a default fallback icon "employee" is displayed. Note: You should import the desired icon first, then use its name as "fallback-icon". import "@ui5/webcomponents-icons/dist/{icon_name}.js" <ui5-avatar fallback-icon="alert"> See all the available icons in the Icon Explorer.
Receives the desired <img> tag Note: If you experience flickering of the provided image, you can hide the component until it is being defined with the following CSS:
Defines the optional badge that will be used for visual affordance. Note: While the slot allows for custom badges, to achieve the Fiori design, please use ui5-badge with ui5-icon in the corresponding icon slot, without text nodes.