Profile
Profile is used to represent a user and add visual information in form of an icon, initials or image.
From Figma to code
...
Customization
INFO
Check everything about the customization mechanics in the "How it works" documentation.
| CSS Variable | Type | Description |
|---|---|---|
--z-profile--bg | color | Background color |
--z-profile--color | color | Foreground color |
--z-profile--size | distance | Size fof the profile |
--z-profile--border-color | color | Border color |
The background, color and size of the profile can be customized using the --z-profile--background, --z-profile--color and --z-profile--size CSS custom properties respectively or the custom attribute.
Also for the outline version of the profile, the border color can be customized using the --z-profile--border-color CSS custom property.