Skip to content

download13/blockies

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

71 Commits

Repository files navigation

Blockies

A tiny library for generating blocky identicons.

Sample blockies image

Demo page

Browser

import{createIcon}from'@download/blockies';varicon=createIcon({// All options are optionalseed: 'randstring',// seed used to generate icon data, default: randomcolor: '#dfe',// to manually specify the icon color, default: randombgcolor: '#aaa',// choose a different background color, default: whitesize: 15,// width/height of the icon in blocks, default: 10scale: 3// width/height of each block in pixels, default: 5});document.body.appendChild(icon);// icon is a canvas element

In the above example the icon will be 15x15 blocks, and each block will be 3x3 pixels. The icon canvas will be 45x45 pixels.

Node

import{createCanvas}from'canvas';import{renderIcon}from'@download/blockies';constcanvas=createCanvas(50,50);varicon=renderIcon({// All options are optionalseed: 'randstring',// seed used to generate icon data, default: randomcolor: '#dfe',// to manually specify the icon color, default: randombgcolor: '#aaa',// choose a different background color, default: whitesize: 15,// width/height of the icon in blocks, default: 10scale: 3// width/height of each block in pixels, default: 5},canvas);

Notes

The defaults of size 10 and scale 5 generate 50x50 pixel icons. Below are some standard sizes that work well. A size larger than 10 will start generating more noisy icons that don't ressemble much.

  • 24x24 {size: 8, scale: 3}
  • 32x32 {size: 8, scale: 4}
  • 48x48 {size: 12, scale: 4}

Alternative Styles

Build

npm run build 

License

WTFPL

About

<1k library that generates blocky identicons

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 11