GENERALwidth: 20px;
height: 20px;
border-radius: 100px;
Icons
Usage
- A generic image will be displayed if there is a problem displaying the image source , or if it wasn’t specified by the user.
- When the avatar is on top of a colored background, the avatar may have a border.
- The avatar might show the user or entity initials instead of an image
Sizes
The avatars come in several sizes in order to adapt to different layouts and screens.
GENERALwidth: 24px;
height: 24px;
border-radius: 100px;
height: 24px;
border-radius: 100px;
GENERALwidth: 33px;
height: 32px;
border-radius: 100px;
height: 32px;
border-radius: 100px;
GENERALwidth: 48px;
height: 48px;
border-radius: 100px;
height: 48px;
border-radius: 100px;
GENERALwidth: 65px;
height: 64px;
border-radius: 100px;
height: 64px;
border-radius: 100px;
GENERALwidth: 20px;
height: 20px;
border-radius: 100px;
height: 20px;
border-radius: 100px;
GENERALwidth: 24px;
height: 24px;
border-radius: 100px;
height: 24px;
border-radius: 100px;
GENERALwidth: 33px;
height: 32px;
border-radius: 100px;
height: 32px;
border-radius: 100px;
GENERALwidth: 48px;
height: 48px;
border-radius: 100px;
height: 48px;
border-radius: 100px;
GENERALwidth: 65px;
height: 64px;
border-radius: 100px;
height: 64px;
border-radius: 100px;
Icon set
The icons in this set serve general purposes and actions that are common in most products. Visit the Iconography section to learn more about icon guidelines and creation. It’s possible to download each icon as an svg directly from the list below, or consume the set from Figma and code libraries.
General
Status
Arrows
