Home

Awesome

npm downloads PRs welcome

vuejs-avataaars

Simple avatar generator Vue component for avataaars.

[Demo] http://vuejs-avataaars.surge.sh/

<p align="center"> <img height="230" width="230" src="https://github.com/orgordin/vuejs-avataaars/blob/master/image.png"> <img height="230" width="230" src="https://github.com/orgordin/vuejs-avataaars/blob/master/image1.png"> <img height="230" width="230" src="https://github.com/orgordin/vuejs-avataaars/blob/master/image2.png"> </p>

avataaars designed by Pablo Stanley.

Features:

Installation

Quick install with NPM:

npm install vuejs-avataaars

Quick install with Yarn:

yarn add vuejs-avataaars

Usage

in your Vue component

<template>
  <div>
    <!--- all random :) ---->
    <avataaars></avataaars>
    
    <!--- with some props ---->
    <avataaars
      :clotheType="'GraphicShirt'"
      :eyebrowType="'Angry'"
      :eyeType="'Cry'"
      :mouthType="'Eating'"
      :facialHairColor="'Blonde'"
      :graphicType="'Cumbia'">
    </avataaars>
  </div>
</template>

<script>
import Avataaars from 'vuejs-avataaars'

export default {
  components: {
    Avataaars
  }
}
</script>

Props

The following props can be passed to the component:

The default state is for all props is random :)

isCircle

circleColor

accessoriesType

clotheType

clotheColor

eyebrowType

eyeType

facialHairColor

facialHairType

graphicType

hairColor

mouthType

skinColor

topType

topColor