Blockatars

React library for generating unique visual hashes. Every small change in seed will generate a vastly different image.

Blockatars internally uses the same system for generating colors as blockies, this was done to preserve some visual compatibility between library that's already widely used. Though, the color distribution may be (and likely will be) different.

Demo / Website

Usage

Install the NPM package

npm install blockatars

Use the Avatar component in your code

import { Avatar } from 'blockatar';

export const Component = () => {
  return (
    <Avatar
      seed="0x0......000" 
      size={24}
    />
  )
}

Reference

Name	Required	Type	Description
seed	✓	string	Any string to be used as a seed for the visual hashing
size	✓	number	Size of the SVG element in pixels
disableLowerCase		boolean	Any value passed into the seed is lower-cased. This option disables that behaviour
disableNoise		boolean	Disables the noise that's by default applied to the avatar
disableBlur		boolean	Disables the blur that's by default applied to the avatar (⚠️ this generates a vastly different-looking avatar)

As seen on

Are you using Blockatars? Create an issue, and your company logo might make it here!

License

React Tree List is licensed under the MIT License.

Authors

Ondřej Bárta · GitHub · website · twitter