Avatars can be used to represent people. When used with a specific logo, avatars can also be used to represent a brand. They also can be a placeholder when there is no image to be shown, showing a initial letter of a name on contacts that have no picture yet, for example.
Avatar
Avatars can show a single image by default but can also display an icon (using the md-icon component):
API - md-avatar
The following option can be applied to any avatar:
| Name | Description |
|---|---|
| md-avatar-icon | Creates a avatar that can show a icon. |
Initial letter as a placeholder
Let's assume that you want to show a list of contacts, but some of them do not have a picture in your database. You can use the initial letter of the contact name as a placeholder. It can even show 2 letters (for compound names) without problems:
Multiple sizes
You can specify three different sizes, if you want: Regular, Small or Large. By default the avatar have a regular size.
API - md-avatar
The following options will change the size of a avatar:
| Name | Description |
|---|---|
| md-small | Makes a small avatar, changing the size of image, icon or text. |
| md-large | Makes a large avatar. Commonly used as the current user avatar inside a left md-drawer. |