Base UI

Avatars
Sizing Avatar variations based on their size.
24px
32px
40px
48px
72px
80px
96px
Avatars variations Avatar variations based on type.
Default
J
Initial
People
Documentation
Available Parameters
Parameter Type Description
size Number
Default : 72 		Set size of avatar.
List of available size :
  • 24
  • 32
  • 40
  • 48
  • 72
  • 80
  • 96
image Text Filename Set avatar image.
The Value is name of image file in the src/assets/images/ folder.
initial Text Display initial if avatar image is empty.
text Text Display text beside avatar image.
Starter Kit Codes
Starter Kit Code 
 {# include components/avatar  #}
 {% include "../../components/avatar.twig", with {
    	"size"		: 72,

	"image"		: "avatar-1.png",
	"text"		: "72px"
 } %}
Starter Kit Code 
 {# include components/avatar  #}
 {% include "../../components/avatar.twig", with {
    	"text"		: "Default"
 } %}
Starter Kit Code 
 {# include components/avatar  #}
 {% include "../../components/avatar.twig", with {
    	"initial"		: "J",
	"text"		: "Initial"
 } %}