Avatar
Overview
An avatar is a visual used to represent a user. It may contain an image or a placeholder graphic.
Installation
npm install @patternfly/elementsUsage
<pf-avatar alt="Eleanore Stillwagon"></pf-avatar>
<pf-avatar alt="Libbie Koscinski"></pf-avatar>
<pf-avatar alt="Blanca Rohloff"></pf-avatar>
<pf-avatar alt="Edwardo Lindsey"
src="https://clayto.com/2014/03/rgb-webgl-color-cube/colorcube.jpg"></pf-avatar>Slots
None
Attributes
size-
Size of the Avatar
- DOM Property
size- Type
-
'sm' | 'md' | 'lg' | 'xl' - Default
-
'sm'
border-
Whether to display a border around the avatar
- DOM Property
border- Type
-
'light' | 'dark' | undefined - Default
-
unknown
src-
The URL to the user's custom avatar image.
- DOM Property
src- Type
-
string | undefined - Default
-
unknown
alt-
The alt text for the avatar image.
- DOM Property
alt- Type
-
string | undefined - Default
-
'Avatar image'
dark-
Whether or not the Avatar image is dark
- DOM Property
dark- Type
-
boolean - Default
-
false
DOM Properties
None
Methods
None
Events
None
CSS Custom Properties
None
CSS Shadow Parts
None
