vue-nice-avatar
Stars
104
Ecosystems:
Vue.js
vue-nice-avatar
Online editor / preview
Assets
- Designer / Figma files: Avatar Illustration System
Installation
yarn add vue-nice-avatar
Usage
-
Import the component
import NiceAvatar from "vue-nice-avatar"; -
Render the component with props
<NiceAvatar />
Options
The options can be passed into genConfig or as React props
| key | type | default | accept |
|---|---|---|---|
size |
string or number | 120 | |
bgColor |
string | random | |
faceColor |
string | random | |
eye |
string | random | circle, oval, smile, shadow |
eyeBrow |
string | random | none, eyebrows-up, eyebrows-down, eyelashes-down, eyelashes-up |
ear |
string | random | small, big |
earring |
string | random | none, stud, hoop |
mouth |
string | random | frown, laughing, nervous, pucker, sad, smile, smirk, suprised |
hair |
string | random | none, danny-phantom, doug-funny, fonza, full, mr-clean, mr-t, pixie, turban |
hairColor |
string | random | |
nose |
string | random | curve, pointed, round |
glasses |
string | random | none, round, square |
beard |
string | random | none, hipster, scruff |
beardColor |
string | random | |
shirt |
string | random | collared, crew, open |
shirtColor |
string | random |
Development
- Clone the repo
git clone [email protected]:ademilter/vue-nice-avatar.git - Clone the repo
cd vue-nice-avatar - Install dependencies
yarn - Start the server for the demo
yarn dev - Open the browser to reivew the demo
open http://localhost:3000 - Edit the files inside
src/components/NiceAvatar.
License
Released under MIT by @ademilter.
Badges
Extracted from project README
