JavaScript library for generating abstract images from unique identifiers.
Clone or download


npm version jsDelivr CDN Build Status Dependencies Status

JavaScript library for generating abstract images from unique identifiers.




$ npm install squareicon


  • md5 - in the browser you can use any hash implementation
  • randomcolor - for color schemes other than raw
  • canvas - only when using NodeJS


In browser

Exemple with SparkMD5.

<script src="randomcolor/randomColor.js"></script>
<script src="spark-md5/spark-md5.js"></script>
<script src="squareicon/browser.js"></script>

<img id="squareicon"></div>

    squareicon({id: 'mistic100', hasher: SparkMD5.hash}, (err, data) => {
        document.querySelector('img').src = data;

In NodeJS

const fs = require('fs');
const squareicon = require('squareicon');

squareicon({id: 'mistic100'}, (err, buffer) => {
    fs.writeFileSync('mistic100.png', buffer);

Command line

$ squareicon --id mistic100 mistic100.png


Option Default Description
id null input identifier, can be empty for random value
hasher md5 function used to transform the id into an hexadecimal string
colors 2 number of colors, can only be 1 or 2
pixels 8 number of pixels, between 2 and 16
size 128 desired size1, between pixels and 2048
padding 0 desired padding, between 0 and size / 3
symmetry none type of symmetry, one of none vertical horizontal central
scheme standard colors scheme2, one of raw standard light bright dark
background transparent background color as a CSS string

1 The final size might be different in order to be pixel perfect

2 raw will directly use the 12 or 24 first bytes of the hash to create colors. Other modes are delegated to randomcolor.


This library is available under the MIT license.