# Avatar ## Description A component for rendering profile images ## Installation ``` yarn add @commercetools-uikit/avatar ``` ``` npm --save install @commercetools-uikit/avatar ``` Additionally install the peer dependencies (if not present) ``` yarn add react ``` ``` npm --save install react ``` ## Usage ```jsx import Avatar from '@commercetools-uikit/avatar'; const Example = () => ( ); export default Example; ``` ## Properties | Props | Type | Required | Default | Description | | --------------- | ------------------------------------------------------------------------------ | :------: | ---------- | --------------------------------------- | | `firstName` | `string` | | `''` | The first name of the user. | | `lastName` | `string` | | `''` | The last name of the user. | | `gravatarHash` | `string` | ✅ | | The hashed string of the user gravatar. | | `isHighlighted` | `boolean` | | `false` | Enhances the appearance of the avatar. | | `size` | `union`
Possible values:
`'s' , 'm' , 'l'` | | `'s'` | The size of the rendered avatar. | | `color` | `union`
Possible values:
`'accent' , 'purple' , 'turquoise' , 'brown'` | | `'accent'` | The color of the avatar. | | `icon` | `ReactElement` | | | an component |