1.0.2 • Published 2 years ago
react-hot-avatars v1.0.2
Install
With NPM:
npm install react-hot-avatars
With Yarn:
yarn add react-hot-avatars
Demo
Check live demo here Link
Getting Started
Import the Avatar component from react-hot-avatars:
import Avatar from 'react-hot-avatars';
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
- name
- size
- rounded
You can pass anything to generate a unique avatar for
Examples:
john doe, john@gmail.com, 😂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 :wave:, 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:blush: .
Start contributing
To contribute follow these simple steps :smiley:
- Fork the repo and create your branch from main.
- Create a new issue
- Commit changes to your branch..
- Create pull request :tada:
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