components
Avatar (code)
Avatars are commonly used to represent a user and can contain photos.
import { Avatar } from '@mediahuis/chameleon-react'
Props
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
| circular | Boolean | false | - | Visual circular appearance or not. |
| className | String | - | - | Extend classNames. |
| size | 'small''medium''large''xLarge' | 'medium' | - | Changes the icon's `height`, and `width`. |
| src | String | - | - | Extend native image src. |
| position | 'relative' | - | - |
System Props
System Props
Next to the properties listed in the propstable, a collection of system props can be added to any component for further general styling and layouting purposes. These props vary per component.
To read more about the system, click here to check out its dedicated page.
Size
default: medium
All avatars are available in sets of four different sizes, where the default size is Medium.
- Small
- Medium
- Large
- xLarge
Circular
default: false
Make the avatar Circular shaped.