Avatars

Avatars can can be used to symbolize people or objects. They are generally used to give a more personalized feeling on a website for each user.

An avatar can be made from one of the following:

  • an image
  • a FontIcon,
  • a letter

An avatar can be created by providing a src prop pointing to the URL of the image. When an avatar is an image, the alt or role="presentation" props should be provided for accessibility.

When the avatar contains an icon or a letter, the colors can be defined by specifying a suffix that links into the md-avatar-colors or by enabling random to randomly choose one of the suffixes to apply.

  • An Avatar with a random image from http://unsplash.it
  • An Avatar with a FontAwesome icon.
  • An Avatar using an SVG Icon
  • M
    An Avatar using a letter and the default color.
  • O
    An Avatar using a letter and a random color.
  • All default colors
  • R
    P
    P
    D
    I
    B
    L
    C
    T
    G
    L
    L
    Y
    A
    O
    D
    B
    G
    B