@tdrmk/avatarmaker NPM

Avatar Maker

Generate random avatar images (in SVG format).

Installation

# Using yarn
yarn add @tdrmk/avatarmaker

# Using npm
npm install @tdrmk/avatarmaker

CDN Links

<script src="https://unpkg.com/@tdrmk/avatarmaker/dist/index.js" defer></script>
<script>
  window.addEventListener("DOMContentLoaded", () => {
    const { svg } = window.AvatarMaker.generateAvatar();
    document.querySelector("#avatar").innerHTML = svg;
  });
</script>

Usage

Generate a random image (gender chosen at random).

const { generateAvatar } = require("@tdrmk/avatarmaker");

// generate a random avatar
const { svg } = generateAvatar();

// logs the svg image
console.log(svg);

Generate a random image with specified gender (male or female).

const { generateAvatar } = require("@tdrmk/avatarmaker");

// generate a random male avatar
const { svg } = generateAvatar({ gender: "male" });

// logs the svg image
console.log(svg);

Obtain features from generated image

const { generateAvatar } = require("@tdrmk/avatarmaker");

// generate a random avatar
const { svg, chosen_zones } = generateAvatar();

// logs the chosen features
console.log(chosen_zones);

// logs the svg image
console.log(svg);

Generate an image with specified features

const { generateAvatar } = require("@tdrmk/avatarmaker");

const chosen_zones = {
  backs: 7,
  clothes: 1,
  ears: 3,
  faceshape: 9,
  mouth: 14,
  eyesiris: 5,
  eyesfront: 8,
  eyebrows: 3,
  nose: 1,
};

// generate a random avatar
const { svg } = generateAvatar({ gender: "male", chosen_zones });

// logs the svg image
console.log(svg);

All available features

const chosen_zones = {
  backs: 1,
  hairback: 13,
  humanbody: 0,
  chinshadow: 5,
  clothes: 11,
  ears: 6,
  faceshape: 11,
  mouth: 13,
  eyesback: 2,
  eyesiris: 7,
  eyesfront: 0,
  facehighlight: 0,
  eyebrows: 10,
  nose: 2,
  beard: 8,
  mustache: 11,
  hairfront: 13,
  glasses: 2,
};

Using Avatar ID

const { generateAvatar } = require("@tdrmk/avatarmaker");
// generate a random avatar
const { avatarId, svg } = generateAvatar({ gender: "male" });
// Ex: avatarId = '1012136229674839'

// some other code ...

// later on regenerate same avatar, use the unique avatar id
const { svg } = generateAvatar({ avatarId });

Generating random avatar images

npx avatarmake > output.svg

Sample images

Some randomly generated images

Sample male 1 Sample male 2 Sample male 3 Sample male 4 Sample male 5 Sample male 6 Sample male 7 Sample male 8 Sample male 9 Sample male 10 Sample male 11 Sample male 12 Sample male 13 Sample male 14 Sample male 15 Sample male 16 Sample male 17 Sample male 18

Sample female 1 Sample female 2 Sample female 3 Sample female 4 Sample female 5 Sample female 6 Sample female 7 Sample female 8 Sample female 9 Sample female 10 Sample female 11 Sample female 12 Sample female 13 Sample female 14 Sample female 15 Sample female 16 Sample female 17 Sample female 18