# UIB AvatarModule

## Prequisites

Add the `AvatarModule` module to your module imports:

```TS
import { AvatarModule } from '@uib/angular';

@NgModule({
  imports: [
    // ...
    AvatarModule,
    // ...
  ],
})
// ...
```

## UibAvatar

### Inputs

- `background`: a css color value (e.g. rgb(0,0,0) or #000000)
- `size`: avatar size (one of small, medium or large)
- `variant`: avatar variant (one of circle or square)

### Examples

With a text:

```HTML
<uib-avatar>
  UI
</uib-avatar>
```

With an icon:

```HTML
<uib-avatar>
  <uib-avatar-icon name="uib-icon--user"></uib-avatar-icon>
</uib-avatar>
```

With an image:

```HTML
<uib-avatar>
  <img alt="" src="my-image" uibAvatarImage />
</uib-avatar>
```

Set background, size and variant:

```HTML
<uib-avatar background="#000000" size="medium" variant="circle">
  UI
</uib-avatar>
```