块块块

一个小的图书馆 用来生成块状的标识符.

演示页

浏览器

import { createIcon } from '@download/blockies';

var icon = createIcon({ // All options are optional
    seed: 'randstring', // seed used to generate icon data, default: random
    color: '#dfe', // to manually specify the icon color, default: random
    bgcolor: '#aaa', // choose a different background color, default: white
    size: 15, // width/height of the icon in blocks, default: 10
    scale: 3 // width/height of each block in pixels, default: 5
});

document.body.appendChild(icon); // icon is a canvas element

在上述例子中,图标为15x15个块,每个块为3x3像素. 图标画布会是45x45像素.

节点

import { createCanvas } from 'canvas'; 
import { renderIcon } from '@download/blockies';

const canvas = createCanvas(50, 50);

var icon = renderIcon(
    { // All options are optional
        seed: 'randstring', // seed used to generate icon data, default: random
        color: '#dfe', // to manually specify the icon color, default: random
        bgcolor: '#aaa', // choose a different background color, default: white
        size: 15, // width/height of the icon in blocks, default: 10
        scale: 3 // width/height of each block in pixels, default: 5
    },
    canvas
);

页:1

大小为10和大小为5的默认生成了50x50像素图标. 下面是一些标准尺寸,效果很好。 一个大于10的大小会开始产生更多不重现的吵闹的图标.

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

替代样式

• https://github.com/alexvandesande/blockies 互联网档案馆的存檔,存档日期2013-12-02 - 更多颜色和外星相

构建

npm run build

许可证

WPFPL (英语)