igaimerca / react-hot-avatars

The Best React Avatars in Town.

<Avatar/>

The Best React Avatars in Town.

Lightweight, customizable and beautiful by default.

Website · npm

Cooked by Aime and Leila 👨‍🍳

Install

With NPM:

npm install react-hot-avatars

With Yarn:

yarn add react-hot-avatars

Demo

Check live demo here Link

Getting Started

1. Import the Avatar component from react-hot-avatars:

   import Avatar from 'react-hot-avatars';

2. Start using it!

   Example

   <Avatar name="john doe" size="300" rounded />

   <Avatar name="_Leila" size="200" />

A React Component using react-hot-avatars

import Avatar from 'react-hot-avatars';

const App = () => {
  return (
    <>
     <Avatar name="aimed" size="300" />
    <>
  );
};

Supported props

1. name
2. size
3. rounded

You can pass anything to generate a unique avatar for

Examples:

 john doe, [email protected], 😂Joy, etc

Other Options

Avatar

Attribute	Options	Default	Description
name	string	"default"	Will be used to generate avatar based on the initials of the person
size	string	"80"	Use values like "200", "300", etc for adjusting the size of the avatar.
rounded	boolean	false	Can be true or false to make the avatar be rounded or not Default false

Request a feature

If you feel like you are missing a cool feature in our package, here are few steps to follow for you to request an new feature

• Create an issue here
• Add title of of the issue, eg: requesting an active badge feature
• In your description try to add clear explanation about your feature with an image attached if possible.

Contributing

Hello there 👋, We're very happy you want to contribute to this project. But be sure to follow the Contribution guide && code of conduct before submitting your contribution😊 .

Start contributing

To contribute follow these simple steps 😃

1. Fork the repo and create your branch from main.
2. Create a new issue
3. Commit changes to your branch..
4. Create pull request 🎉

Make sure to make a good branch name

Your branch should be name like your_name/issue_fix.
For example: gasaroleila/avatar-style

Issues

• If you spot a problem, search if an issue already exists in the search the issue tracker. If a related issue doesn't exist, you can open a new issue using a relevant issue form.
• If you want to simply solve issues, Find one to solve in the existing issues

Maintainers

• @igaimerca
• @gasaroleila

License

MIT License

react-hot-avatars's Issues

Add more other types

reference boringavatars