avatar

A person's image, or initials from their name.

Example

Laravel

<x-admin::toolbar>
    <x-admin::avatar name="Rina Example" size="sm" />
    <x-admin::avatar name="Rina Example" />
    <x-admin::avatar name="Rina Example" size="lg" />
</x-admin::toolbar>

Props

PropRequiredDefaultOptions
name""
imagenull
sizenullsm, lg

Other attributes, such as wire:model or data-*, pass through to the element.

Other stacks

React and Vue: import { Avatar } from "@admiral/ui-kit/react" (or /vue). See the React and Vue guide.

HTML, for any stack
<div class="adm-toolbar" role="toolbar"><span class="adm-avatar adm-avatar--sm"  role="img" aria-label="Rina Example" >RE</span>
    <span class="adm-avatar"  role="img" aria-label="Rina Example" >RE</span>
    <span class="adm-avatar adm-avatar--lg"  role="img" aria-label="Rina Example" >RE</span></div>