Avatar
A basic avatar component. Use avatars to visually represent entities in your product, for example people, tokens, currency and companies.
Usage Example#
Live Editor
Result
Props#
| Prop | Type | Default | Description |
|---|---|---|---|
| alt | string (optional) | 'Avatar' | Sets alt attribute on image for accessibility. |
| bg | string (optional) | 'grey' | Sets background color. |
| size | string (optional) | '2rem' | Sets avatar height and width. |
| src | string (required) | Sets avatar image. | |
| theme | object (optional) | Sets theme. |
Avatar also uses COMMON, LAYOUT, POSITION, FLEXBOX, BORDERS groups of Styled System props.