This sample demonstrates the default avatar and circle avatar for which the .e-avatar
and
.e-avatar-circle
class needs to be added respectively to the target element.
The avatar is developed in pure CSS which is used to represent the profile picture, initials, or icons in a presentable way. It comes with two different shapes, they are listed below.
.e-avatar
class to the target element..e-avatar-circle
class to the target element.The avatar comes with 5 different sizes, which can be applied through modifier classes. They are listed below.
.e-avatar-xsmall.
.e-avatar-small.
.e-avatar
, No additional class needed for this..e-avatar-large.
.e-avatar-xlarge.
The .e-avatar
is the main class which needs to be included in an element to use any of the other avatar features.
The images can be added in two different way to the avatar.
background
property on the avatar element, which doesn’t require any additional element.