Profile ⚠️ Experimental

The Profile component can be used imported from:

Playground

Parameters

Slots

This component has slots. Check the documentation about how to use the slots.

Name	Tags	Description
image-src	span	The image to be displayed inside the profile.
default	span	The initials of the user.

Parameters use

Check the documentation about how to use the parameters.

content

The content parameter is used to define the initials of the profile. Only the first two characters will be displayed. It can also use the default slot.

If nothing is provided, it will fallback to a generic user icon.

AA

config

The config parameter is used to define the profile size, color and outline. Following the pattern: <?size><?:color><?:outline>

size

The modifier size is used to define the size of the profile. Possible values are: l, m, s

AZAZ

color

The modifier color is used to define the color of the profile. Possible values are: 1, 2, 3, 4, 5, 6

123456

outline

The modifier outline is used to define the profile with a border.

AZ

Attention!

If the outline parameter is present, the color parameter will be ignored.

status

The status parameter is used to define the profile status. Possible values are: online, absent,occupied

AZAZAZ

image-src

The image-src parameter is used to define the image URL to be displayed. If the image is not found, a default user icon will be displayed.

Browser support

Detected engine:  

• Chromium

• Webkit

• Gecko

CodeSandbox example

Sorry, not available yet ☹️