JavaScript Library for Generating Random Cartoon Avatars SVG – faces.js

faces.js is a JavaScript library that generates and displays cartoon faces, somewhat reminiscent of how the Nintendo Wii generates random Miis. Faces are drawn as scalable vector graphics (SVG). Each face can also be represented by a small JavaScript object, which allows you to store that object and then draw the same face again later.As you can probably tell, the number of options for each facial feature (eyes, nose, mouth, etc.) is fairly limited, and some of the current options are fairly crude.
javascript-face.js



Download and place the JavaScript file faces.js at the bottom of the webpage.

<script src="faces.js"></script>

Display a randomly-generated face (the size of #myDivId determines the size of the displayed face):

<div id="myDivId"></div>
<script>
  faces.generate("myDivId");
</script>

Generate and save a random face object without displaying it:

<script>
  var face = faces.generate();
</script>




Display a saved face object:

<div id="myDivId"></div>
<script>
  faces.display("myDivId", face);
</script>

Combining 2. and 3. into one line, generate and save a random face object while displaying it:

<div id="myDivId"></div>
<script>
  var face = faces.generate("myDivId");
</script>

See live demo and download source code.

DEMO | DOWNLOAD

This awesome plugin is developed by dumbmatter. Visit their official github repository for more information and follow for future updates.


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.