npm package: @redtea/always-avatar
Description: Generate a nice replacement of avatar for you using, for example, a username or email
Author: Kirill Khoroshilov
Latest version: 1.0.0-beta.3

# Always Avatar

<div align="center">
    <a href="https://www.npmjs.com/package/@redtea/always-avatar"><img src="https://img.shields.io/npm/v/@redtea/always-avatar.svg" alt="Version" /></a>
<a href="https://stenciljs.com/"><img src="https://img.shields.io/badge/-Built%20With%20Stencil-16161d.svg?logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI%2BCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI%2BCgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU%2BCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00MjQuNywzNzMuOWMwLDM3LjYtNTUuMSw2OC42LTkyLjcsNjguNkgxODAuNGMtMzcuOSwwLTkyLjctMzAuNy05Mi43LTY4LjZ2LTMuNmgzMzYuOVYzNzMuOXoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTQyNC43LDI5Mi4xSDE4MC40Yy0zNy42LDAtOTIuNy0zMS05Mi43LTY4LjZ2LTMuNkgzMzJjMzcuNiwwLDkyLjcsMzEsOTIuNyw2OC42VjI5Mi4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNDI0LjcsMTQxLjdIODcuN3YtMy42YzAtMzcuNiw1NC44LTY4LjYsOTIuNy02OC42SDMzMmMzNy45LDAsOTIuNywzMC43LDkyLjcsNjguNlYxNDEuN3oiLz4KPC9zdmc%2BCg%3D%3D&colorA=16161d&style=flat-square" alt="Built With Stencil" /></a>
</div>

[RU](https://github.com/org-redtea/always-avatar/blob/master/readme-ru.md)

No avatar? - No problem! Let`s generate it!

**Always Avatar** will generate a nice replacement of avatar for you using, for example, a username or email.

# Installing

```bash
$ npm install -SE @redtea/always-avatar
```

# How to use

Always Avatar made with [Stencil](https://stenciljs.com/), so you can use it anywhere. More details on how to use the component with your framework [here](https://stenciljs.com/docs/overview), and how to include to your web page [here](https://stenciljs.com/docs/javascript).

```HTML
<always-avatar source="mr.hokid@gmail.com" size="40"></always-avatar>
<always-avatar source="Kirill Khoroshilov" size="40"></always-avatar>
<always-avatar source="mr-no-avatar" size="40"></always-avatar>
<always-avatar source="no.avatar" size="40"></always-avatar>
```

<div align="center">
  <img alt="Avatar for mr.hokid@gmail.com" src="https://raw.githubusercontent.com/org-redtea/always-avatar/master/docs/images/example_1.png" width="40" height="40" />
  <img alt="Avatar for Kirill Khoroshilov" src="https://raw.githubusercontent.com/org-redtea/always-avatar/master/docs/images/example_2.png" width="40" height="40" />
  <img alt="Avatar for mr-no-avatar" src="https://raw.githubusercontent.com/org-redtea/always-avatar/master/docs/images/example_3.png" width="40" height="40" />
  <img alt="Avatar for no.avatar" src="https://raw.githubusercontent.com/org-redtea/always-avatar/master/docs/images/example_4.png" width="40" height="40" />
</div>

<div align="center">
  <a href="https://org-redtea.github.io/always-avatar/">More examples</a>
</div>