https://github.com/mistic100/squareicon

JavaScript library for generating abstract images from unique identifiers.
https://github.com/mistic100/squareicon

art avatar

Last synced: 14 days ago
JSON representation

JavaScript library for generating abstract images from unique identifiers.

• Host: GitHub
• URL: https://github.com/mistic100/squareicon
• Owner: mistic100
• Created: 2018-12-16T21:30:04.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2024-09-24T07:54:29.000Z (3 months ago)
• Last Synced: 2024-12-18T08:08:34.770Z (20 days ago)
• Topics: art, avatar
• Language: JavaScript
• Homepage: https://mistic100.github.io/squareicon
• Size: 66.4 KB
• Stars: 17
• Watchers: 4
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# squareicon

[![npm version](https://img.shields.io/npm/v/squareicon.svg?style=flat-square)](https://www.npmjs.com/package/squareicon)

[![jsDelivr CDN](https://data.jsdelivr.com/v1/package/npm/squareicon/badge)](https://www.jsdelivr.com/package/npm/squareicon)

[![GZIP size](https://img.shields.io/bundlephobia/minzip/squareicon?label=gzip%20size)](https://bundlephobia.com/result?p=squareicon)

[![Build Status](https://github.com/mistic100/squareicon/workflows/CI/badge.svg)](https://github.com/mistic100/squareicon/actions)

JavaScript library for generating abstract images from unique identifiers.

![sample](./sample.png)

## Demo

https://mistic100.github.io/squareicon

## Installation

```

$ npm install squareicon

```

### Dependencies

- [randomcolor](https://www.npmjs.com/package/randomcolor) - for color schemes other than `raw`

- [canvas](https://www.npmjs.com/package/canvas) - only when using NodeJS

## Usage

### In browser

```html



    squareicon({ id: 'mistic100' }, (err, data) => {

        document.querySelector('img').src = data;

    });

    squareicon({ id: 'mistic100'})

        .then(data => {

            document.querySelector('img').src = data;

        });

```

### In NodeJS

```js

const fs = require('fs');

const squareicon = require('squareicon');

squareicon({ id: 'mistic100' }, (err, buffer) => {

    fs.writeFileSync('mistic100.png', buffer);

});

squareicon({ id: 'mistic100'})

    .then(data => {

        fs.writeFileSync('mistic100.png', buffer);

    });

```

### Command line

```

$ squareicon --id mistic100 mistic100.png

```

## Options

| Option | Default | Description |

| ------ | ------- | ----------- |

| id | null |input identifier, can be empty for random value |

| hasher | sha11 | 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 size2, 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 scheme3, one of `raw`, `standard`, `light`, `bright`, `dark` |

| background | transparent | background color as a CSS string |

> 1 It uses the [crypto module](https://nodejs.org/api/crypto.html) on NodeJS and the [SubtleCrypto API](https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/digest) on the browser.

> 

> 2 The final size might be different in order to be pixel perfect

>

> 3 `raw` will directly use the 12 or 24 first bytes of the hash to create colors. Other modes are delegated to [randomcolor](https://www.npmjs.com/package/randomcolor).

## License

This library is available under the MIT license.