📢 Announcing @ngneat/avvvatars
Beautifully crafted unique avatar placeholder for your next angular project.
🌈 40 Colors
💠 60 Shapes
🆎 Text or Shapes
🤠 Unique to user
✍️ Customizable
Installation
With yarn
yarn add @ngneat/avvvatars
With npm
npm install @ngneat/avvvatars
Getting Started
Import @ngneat/avvvatars to your app, then use it anywhere you want.
import { AvvvatarsComponent } from '@ngneat/avvvatars';
@Component({
selector: 'app-root',
standalone: true,
imports: [AvvvatarsComponent],
template: `
<avvvatars value="best_user@gmail.com"></avvvatars>
`
})
export class AppComponent {}
View live demo on
@ngneat/avvvatars
ngneat.github.io
Checkout full documentation on
@ngneat/avvvatars
Beautifully crafted unique avatar placeholder for your next angular project. Inspired from avvvatars
demo.mp4
Compatibility with Angular Versions
| @ngneat/avvvatars | Angular |
|---|---|
| 1.x | >= 17 |
Features
- 🌈 40 Colors - Colors are so on point that most of the projects can use it without changing it
- 💠 60 Shapes - Beautifully crafted shapes that are unique to your user with color combination
- 🆎 Text or Shapes 🔸 - Use letters (eg. JD for John Doe) or unique shapes
- 🤠 Unique to user - Generated avatars are unique to the string that you provide, it means if you pass janedoe@gmail.com you will always get the same avatar
- ✍️ Customizable - use shadows, change size, provide alternative text to display
Installation
With yarn
yarn add @ngneat/avvvatars
With npm
npm install @ngneat/avvvatars
Getting Started
Import @ngneat/avvvatars to your app, then use it anywhere you want.
import { AvvvatarsComponent } from '@ngneat/avvvatars';
@Component…
Top comments (0)