### CAvatar

```jsx
import { CAvatar } from '@coreui/vue'
// or
import CAvatar from '@coreui/vue/src/components/avatar/CAvatar'
```

#### Props

| Prop name      | Description                                                                      | Type   | Values                                                                                                                                                                                                                                                                                                                                                                      | Default |
| -------------- | -------------------------------------------------------------------------------- | ------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------- |
| **color**      | Sets the color context of the component to one of CoreUI’s themed colors.        | string | `'primary'`, `'secondary'`, `'success'`, `'danger'`, `'warning'`, `'info'`, `'dark'`, `'light'`                                                                                                                                                                                                                                                                             | -       |
| **shape**      | Select the shape of the component.                                               | string | `'rounded'`, `'rounded-top'`, `'rounded-end'`, `'rounded-bottom'`, `'rounded-start'`, `'rounded-circle'`, `'rounded-pill'`, `'rounded-0'`, `'rounded-1'`, `'rounded-2'`, `'rounded-3'`                                                                                                                                                                                      | -       |
| **size**       | Size the component small, large, or extra large.                                 | string | `'sm'`, `'md'`, `'lg'`, `'xl'`                                                                                                                                                                                                                                                                                                                                              | -       |
| **src**        | The src attribute for the img element.                                           | string | -                                                                                                                                                                                                                                                                                                                                                                           | -       |
| **status**     | Sets the color context of the status indicator to one of CoreUI’s themed colors. | string | `'primary'`, `'secondary'`, `'success'`, `'danger'`, `'warning'`, `'info'`, `'dark'`, `'light'`                                                                                                                                                                                                                                                                             | -       |
| **text-color** | Sets the text color of the component to one of CoreUI’s themed colors.           | string | `'primary'`, `'secondary'`, `'success'`, `'danger'`, `'warning'`, `'info'`, `'dark'`, `'light'`, `'primary-emphasis'`, `'secondary-emphasis'`, `'success-emphasis'`, `'danger-emphasis'`, `'warning-emphasis'`, `'info-emphasis'`, `'light-emphasis'`, `'body'`, `'body-emphasis'`, `'body-secondary'`, `'body-tertiary'`, `'black'`, `'black-50'`, `'white'`, `'white-50'` | -       |
