https://github.com/boringdesigners/boring-avatars
Boring avatars is an open source React library that generates custom, SVG-based avatars from any username and color palette.
https://github.com/boringdesigners/boring-avatars
avatar avatar-component avatar-generator avatar-placeholder avatar-service avatars-constructor beautiful-avatars javascript open-source random-avatars react svg
Last synced: 25 days ago
JSON representation
Boring avatars is an open source React library that generates custom, SVG-based avatars from any username and color palette.
- Host: GitHub
- URL: https://github.com/boringdesigners/boring-avatars
- Owner: boringdesigners
- License: mit
- Created: 2020-12-23T13:47:36.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2026-06-19T16:39:01.000Z (5 months ago)
- Last Synced: 2026-10-17T05:33:36.485Z (27 days ago)
- Topics: avatar, avatar-component, avatar-generator, avatar-placeholder, avatar-service, avatars-constructor, beautiful-avatars, javascript, open-source, random-avatars, react, svg
- Language: TypeScript
- Homepage: https://boringavatars.com
- Size: 2.91 MB
- Stars: 6,460
- Watchers: 22
- Forks: 215
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- awesome-github-star - boring-avatars - based avatars from any username and color palette. | boringdesigners | 5059 | (JavaScript)
- awesome-javascript - boringdesigners/boring-avatars - Boring avatars is an open source React library that generates custom, SVG-based avatars from any username and color palette. (Web / Frontend and UI Components)
- awesome - boringdesigners/boring-avatars - Boring avatars is an open source React library that generates custom, SVG-based avatars from any username and color palette. (TypeScript)
- awesome-repos - boring-avatars
README
# Boring avatars
Boring avatars is an open source React library and a subscription-based service that generates unique SVG-based user profile avatars from usernames, emails or any random strings.
## Install
```
npm install boring-avatars
```
## Usage
```jsx
import Avatar from 'boring-avatars';
;
```
### Props
| Prop | Type | Default |
|---------|--------------------------------------------------------------|-----------------------------------------------------------|
| size | number or string | `40px` |
| square | boolean | `false` |
| title | boolean | `false` |
| name | string | `Clara Barton` |
| variant | oneOf: `marble`, `beam`, `pixel`,`sunset`, `ring`, `bauhaus` | `marble` |
| colors | array | `['#92A1C6', '#146A7C', '#F0AB3D', '#C271B4', '#C20D90']` |
#### Name
The `name` prop is used to generate the avatar. It can be the username, email or any random string.
```jsx
```
#### Variant
The `variant` prop is used to change the theme of the avatar. The available variants are: `marble`, `beam`, `pixel`, `sunset`, `ring` and `bauhaus`.
```jsx
```
#### Size
The `size` prop is used to change the size of the avatar.
```jsx
```
#### Colors
The `colors` prop is used to change the color palette of the avatar.
```jsx
```
#### Square
The `square` prop is used to make the avatar square.
```jsx
```
## API service
If you need to generate avatars on a large scale or if you just want to avoid using the React library, we offer a subscription plan for our API service.
[Gumroad subscription](https://boringdesigners.gumroad.com/l/boring-avatars-service).
## Sponsors
[](https://www.testmuai.com)
Boring avatars is generously sponsored by [TestMu AI](https://www.testmuai.com).
TestMu AI (formerly LambdaTest) is the world's first full-stack agentic AI quality engineering platform. Autonomous AI agents plan, author, execute, analyze, and optimize tests with humans in the loop, across 3,000+ browser/OS combinations and 10,000+ real devices. Trusted by 18,000+ enterprises including Microsoft, OpenAI, NVIDIA, and Vimeo.
Explore the platform: https://www.testmuai.com