π’ 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)