README
React Identicon Variety Pack! is a react component that displays one of a selection of different identicons. It's useful for turning hard to read computer data (like a cryptographic key) into a form that's easily recognizable for humans. Here's an overview of the subject.
Live demo
Here's a live demo for you to play with.
Installation
yarn add react-identicon-variety-pack
Usage
import { Network as Identicon } from 'react-identicon-variety-pack'
<Identicon
size={64}
seed={'yourpublickeyorhash'}
/>
Available styles
These are the component names, so you can eg import { Blockies } from 'react-identicon-variety-pack'
.
Network
Bishop
Based on the algorithm used for ssh visual keys.
Rings
Blockies
Based on this library.
Network Large
Discs
Props
seed
random seed that generates the image.
size
size in pixels
gridSize
number of rows and columns in grid (only relevant for Blockies and Bishop).
scale
size of each gird cell in pixes (only relevant for Blockies and Bishop).
A note about security
With the (qualified) exception of Bishop*, these algorithms have not been studied for how well behaved they are as hashing functions, with regard to the three properties of preimage resistance, 2nd-preimage resistance and collision resistance. This means I can make no gaurantees about how easy it would be to spoof one of these by finding a seed that generates an image sufficiently close to a desired image. My guess is it would be very hard with any of them, but that's not backed by research. So if you are using these as part of a security protocol, you will have to satisfy yourself that they meet your requirements.
* "Qualified" because while Bishop has been studied, it was the ascii art version that was studied. The version presented here is a pixel art version and has very different visual properties.