Avatar 🪲 Debugging ​

The Avatar component can be used imported from:

Playground ​

Construction ​

The CSS component uses a <div> tag with the z-avatar HTML custom attribute.

TIP

Check the badge and the profile components to learn more about the component.

z-avatar ​

The z-avatar parameter is the main parameter used to render the avatar component. It's also used to configure the avatar between horizontal, vertical or dropdown.

Horizontal ​

Name

description
Vertical ​

Name

description

Browser support ​

Detected engine:  

  • Chromium

  • Webkit

  • Gecko

HTML Examples ​

CodeSandbox example ​