Avatars

import { Avatar } from '@skeletonlabs/skeleton';

Demo

Using Initials

Display up to two text characters. (ex: Jane Doe would be JD)

Fallback

Use the default slot to provide fallback images, icons, or text.

Interactive Border

Apply the following styles using the border and cursor properties.

Applying Filters

See Filters to learn how to import and configure the filters action and SVG filter components.

typescript Copy

import { filter, Apollo } from '@skeletonlabs/skeleton';