react-identicons
React component for generating and displaying github-style identicons.
Live demo
tuhnik.github.io/identicon-live (old)
tuhnik.github.io/react-identicons (storybook)
Setup
npm install react-identicons --save
Basic usage
import React from 'react';
import Identicon from 'react-identicons';
const App = () => {
return <Identicon string="randomness" />;
};
export default App;
Code above should result in the following identicon:
Props
Note: all color values should use hexadecimal notation (i.e. #ebebeb)
-
string
: (String) Value used for identicon pattern generation. -
size
: (Number) Single number to represent width and height of identicon image. Defaults to 400. -
padding
(Number) Padding around blocks. Defaults to 0. -
bg
(String) Override color for background blocks. Transparent by default. -
fg
(String) Override color for foreground blocks. Generated randomly from hash by default. -
palette
(Array) Provide an array of colors to be used as foreground block colors. -
count
(Number) Block count, can't be higher than 5. Useful for generating smaller (i.e. 3x3 identicons). -
getColor
(Function) Callback function which returns current foreground color value.