In order to give you a better service Airbus uses cookies. By continuing to browse the site you are agreeing to our use of cookies I agree

Avatar

An avatar is a circular image used for representing a unique user.

General guidelines

An avatar is a photographic representation of a user (usually a portrait). The avatar can stand alone, but is often associated with a username.

Use the avatar when it is necessary to visually identify a user, which could be in a login area in the app header, or in a chat post, or in a work group restricted to certain users, for example.

It helps to personify users and make them more human for other app users (a face is much easier to recognize by the human brain). Moreover, contextual information may be displayed with a click on the avatar (profile, account configuration, replacing the photo, etc.).

In case no picture has been uploaded yet or no image is available (for a guest user, for example), in these cases, an image placeholder is used by default.

 

The picture is showing a list of Avatars in different size with different status.
Best practices
Good practice about the use of the avatar in a circle mask.

Always put the avatar in a circle mask: the format is perfectly adapted for a face format.

Bad practice about the use of accordion in a rectangle.

Don't use another format. Lines will not be equidistant to each other, which will generate more time to scan the picture for the user, especially while browsing a long list.

Visual guidelines

Visual Variants

If the user doesn’t have any pictures, we recommend using a placeholder picture by default. For non-human users (robots), we recommend using a dedicated picture. The picture can be changed by the user.

The picture is showing different kind of avatars (with a placeholder, for chatbots and with a picture for humans)
Code & Design assets

Request code and design assets for creating user interfaces.

Component overview

Component overview

Can I contribute to the System?

Of course! Your contribution is more than welcomed and the System team will always be here to review your contributions or discuss.

Back to top