avatar

A React library that generates custom round avatars from username and color

Jun 02, 2021
A React library that generates custom round avatars from username and color

Boring Avatars

Boring avatars is a tiny JavaScript React library that generates custom, SVG-based, round avatars from any username and color palette.

View Demo View Github

Install

yarn add boring-avatars

or

npm install boring-avatars

Usage

import Avatar from "boring-avatars"; <Avatar size={40} name="Maria Mitchell" variant="marble" colors={["#92A1C6", "#146A7C", "#F0AB3D", "#C271B4", "#C20D90"]} />;

Props

PropType
sizenumber or string
namestring
variantoneOf: marble, beam, pixel,sunset, ring, bauhaus
colorsarray of colors

Source

You can embed your boring avatars using the boring avatars source.

To choose a random avatar from a specific user and a color palette, the format follows:

https://source.boringavatars.com/marble/120/Maria%20Mitchell?colors=264653,2a9d8f,e9c46a,f4a261,e76f51
Recommended