React Library For Generating User Avatar From Photo For Vuejs

React nice avatar is Vue’s library for creating nice user avatars, inspired by the chilllab react.js avatar.

random avatar generator, free avatar generator, avatar generator from photo, random avatar generator api, avatar url generator, abstract avatar generator

How to make use of it:

Install and download:

# Yarn
$ yarn add holiday-avatar

# NPM
$ npm i holiday-avatar --save

Import the component.

import Avatar, { genConfig } from 'react-nice-avatar'

Create a random config, and save it so that you can always display the same avatar with the config.

const config = genConfig(AvatarConfig?)

Make the component a specific width/height and configuration.

<Avatar style={{ width: '8rem', height: '8rem' }} {...config} />

<Avatar className="w-32 h-32" {...config} />

Options

The options can be passed into genConfig or as React props

key	type	default	accept	tips
`id`	string			Only for React Props
`className`	string			Only for React Props
`style`	object			Only for React Props
`shape`	string	circle	circle, rounded, square	Only for React Props
`sex`	string		man, woman
`faceColor`	string
`earSize`	string		small, big
`hairColor`	string
`hairStyle`	string		normal, thick, mohawk, womanLong, womanShort
`hairColorRandom`	boolean	false		thick,mohawk default only be black
`hatColor`	string
`hatStyle`	string		none, beanie, turban	Usually is none
`eyeStyle`	string		circle, oval, smile
`glassesStyle`	string		none, round, square	Usually is none
`noseStyle`	string		short, long, round
`mouthStyle`	string		laugh, smile, peace
`shirtStyle`	string		hoody, short, polo
`shirtColor`	string
`bgColor`	string
`isGradient`	boolean	false