Avatar

Used to display profile image, initial or fallback icon.

Import

import { MpAvatar, MpAvatarGroup } from '@mekari/pixel3'

Props

Events

Slots

Name	Type	Default
`id` Id of avatar.	`string`	-
`name` Name of avatar.	`string`	-
`variant` Variant of avatar.	`square \| circle`	`circle`
`variant-color` Variant color of avatar. Not set will be get random color.	`gray \| sky \| teal \| violet \| amber \| rose \| stone \| lime \| pink`	-
`size` Size of avatar.	`sm \| md \| lg \| xl`	`md`
`has-border` If true, avatar border will be displayed.	`boolean`	`false`
`border-color` Border color of avatar.	`string`	-
`src` Image url of avatar.	`string`	-
`icon` Icon of avatar.	`string`	-
`icon-variant` Icon variant of avatar.	`outline \| duotone \| fill`	-
`icon-color` Icon color of avatar.	`string`	-

Props

Events

Slots

Name	Type	Default
`id` Id of avatar group.	`string`	-
`size` Size of avatar in group.	`sm \| md \| lg \| xl`	`md`
`max` Displayed maximum avatar.	`number`	`3`
`spacing` Space between each avatar in group.	`number`	`-2`
`border-color` Border color of avatar.	`string`	-