Upgrade toQuasar v2and use Vue.js 3

The QAvatar component creates a scalable, color-able element that can have text, icon or image within its shape. By default it is circular, but it can also be square or have a border-radius applied to give rounded corners to the square shape.

It is often used with other components in their slots.

QAvatar API



The size property will determine the height and the width of the Avatar. The font-size property will set the size of the font used within the Avatar, which will have an effect on the size of letters and icons.