Simple random avatar generation for Vue3.
Implemented with avataaars designed by Pablo Stanley and inspired by Or Gordin's vuejs-avataaars.
npm install vue3-avataaarsThe library comes with 2 main parts. An Avatar component for use in templates and Factory method for generating an object of parameters for your Avatar (e.g. hair color, clothes type etc).
import { Avatar, Factory } from 'vue3-avataaars';
const props = Factory();<Avatar v-bind="props" />The list of available parameters can be viewed in Types.ts.
{
isCircle: boolean, // Place avatar in a background-circle
circleColor?: Hex,
hairColor: Hex,
skinColor: Hex,
clothesColor: Hex,
topColor: Hex,
facialHairColor: Hex,
clothes: keyof typeof Clothes,
graphicShirt: keyof typeof GraphicShirt,
top: keyof typeof Tops,
accessories: keyof typeof Accessories,
facialHair: keyof typeof FacialHair,
eyes: keyof typeof Eyes,
eyebrows: keyof typeof Eyebrows,
mouth: keyof typeof Mouths,
}A very simple implementation can be seen in action at vue3-avataaars.com