Avatar
The v-avatar component is used to control the size and border radius of responsive images, typically used to show profile pictures.
Usage
The avatar has a dynamic size that can be scaled for any situation. A tile variation is available for displaying an avatar without border radius.
API
Name
color
Default
undefined
Type
string
Applies specified color to the control - it can be the name of material color (for example success or purple) or css color (#033 or rgba(255, 0, 0, 0.5))
Name
size
Default
48
Type
number | string
Sets the height and width of the element
Name
tile
Default
false
Type
boolean
Removes border radius
Examples
Advanced usage
Combining an avatar with other components allows you to build beautiful user interfaces right out of the box.
Icon and text
An avatar also accepts the v-icon component or text. Mix and match functionality to create something unique.