Identicon.js

Basic Usage

Specify just a hash, use default background color, margins, and size.

  var hash = 'd6fe8c82fb0abac17a702fd2a94eff37';
  var data = new Identicon(hash).toString();
  document.write('<img src="data:image/png;base64,' + data + '">');

SVG Output

To generate SVGs, set the 'format' option to 'svg'.

  var hash = 'd6fe8c82fb0abac17a702fd2a94eff37';
  var data = new Identicon(hash, {format: 'svg'}).toString();
  document.write('<img src="data:image/svg+xml;base64,' + data + '">');

Options

Specify a hash and an options object to customize background color, margins, size and format.

  var hash = 'd6fe8c82fb0abac17a702fd2a94eff37';
  var options = {
    foreground: [255, 255, 255, 255],
    background: [0, 0, 0, 255],
    margin: 0.2,
    size: 128,
    format: 'svg'
  };
  var data = new Identicon(hash, options).toString();
  document.write('<img src="data:image/svg+xml;base64,' + data + '">');

Raw (Smaller)

The toString() method accepts an optional boolean argument that when set to true will return unencoded image data which is slightly smaller than the default base64 output. In the case of SVG this is still safe to use in a data URI provided that the attribute is double-quoted.

  var data = new Identicon(hash, options).toString(true);
  document.write('<img src="data:image/svg+xml;utf8,' + data + '">');

Time-based

Omit the hash to generate an identicon based on the current time.

  var data = new Identicon().toString();
  document.write('<img src="data:image/png;base64,' + data + '">');