React Avatar Generator | Nice Avatars with React

A pretty nice and highly customizable avatar generator for React.

Customziations:

• SEX: Man or Woman
• FACE: Light or Dark
• HAIR: Normal, Thick, Mohawk, Woman Long, or Woman Short
• EYES: Circle, Oval, Or Smile
• GLASSES: None, Round, Or Square
• EAR: Small Or Big
• NOSE: Short, Long, Or Round
• MOUTH: Laugh, Smile, Or Peace
• SHIRT: Hoody, Short, Or Polo
• BACKGROUND: Circle, Rounded, Or Square

How to use it:

1. Install and import the avatar generator.

# Yarn
$ yarn add react-nice-avatar

# NPM
$ npm i react-nice-avatar --save// import
import Avatar, { genConfig } from 'react-nice-avatar'
// generate random config
const config = genConfig(AvatarConfig?)

2. Generate a random avatar.

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

3. Available component props.

id: PropTypes.string,
className: PropTypes.string,
style: PropTypes.object,
shape: PropTypes.oneOf(["circle", "rounded", "square"]),
sex: PropTypes.oneOf(["man", "woman"]),
faceColor: PropTypes.string,
earSize: PropTypes.oneOf(["small", "big"]),
hairColor: PropTypes.string,
hairStyle: PropTypes.oneOf(["normal", "thick", "mohawk", "womanLong", "womanShort"]),
eyeStyle: PropTypes.oneOf(["circle", "oval", "smile"]),
glassesStyle: PropTypes.oneOf(["round", "square", "none"]),
noseStyle: PropTypes.oneOf(["short", "long", "round"]),
mouthStyle: PropTypes.oneOf(["laugh", "smile", "peace"]),
shirtStyle: PropTypes.oneOf(["hoody", "short", "polo"]),
shirtColor: PropTypes.string,
bgColor: PropTypes.string

Preview:

Download Details:

Author: chilllab

Live Demo: View The Demo

Download Link: Download The Source Code

Official Website: https://github.com/chilllab/react-nice-avatar

License: MIT

#react #reactjs