Avatio Avatar

VueJS 2 component to display SVG avatar.

Vector graphic is designed by Teneresa - and therefore I ow her a big thank you!

Inspiration came from Avataaars, which is similar project focusing on React.

Features

• SVG
• Configurable
• Extensible

How to use

At first you have to install package by yarn or npm like so

yarn add avatio-avatar

Then you can use the component

import Avatar, {Config} from 'avatio-avatar';

const app = new Vue({
    components: {Avatar},
    template: `<avatar :config="config" :options="options"></avatar>`,
    data: {
        config: Config['Female'],
        options: {
          FemaleGlasses: {
            color: "#fff",
            type: "B",
          },
          //...
        },
    }
});

Configuration

All component is dynamical and is generated by configuration, take a look. By this mechanism is easily extensible and config is used to generate UI of avatar generator.

Building

If you want to build the package, you can run

yarn build