React Celebrity Avatars

A Celebrity Avatar Library for React created by Jagath Jayakumar.

Installation

yarn add react-celebrity-avatars
# or
npm install react-celebrity-avatars --save

example usage

import { Mohanlal } from 'react-celebrity-avatars';

const myComponent = () => {
  return (
    <Mohanlal
      className="custom-class other-class"
      status="online"
      size="1"
      shape="circle"
      theme="tan"
      borderTheme="sandstorm"
    />
  );
};

| Props | Default | Values | Notes | | ------------- | ----------- | ----------------------------------- | ---------------------------------- | | className | undefined | any string | Can add one or more custom classes | | status | 1em | online, busy | Can use any of the values | | style | undefined | | Can overwrite size, theme, border | | size | 1 | 1, 2, 3, 4,...24 | Use any number 1 to 24 | | shape | circle | circle, rounded, square | Can change shape of the avatar | | theme | undefined | dark, light, lavender, cherry etc | Refer below listed values | | borderTheme | undefined | dark, light, lavender, pink etc | Refer below listed values | | title | undefined | any string | Description for accessibility |

theme:

dark, light, lavender, turquoise, pink, sandstorm, blue, lily, pearl, tan, marine, orange, fresh, hosanna, dreamy, love, piglet, mauve, shades, memory, social, cherry, insta

borderTheme:

dark, light, lavender, turquoise, pink, sandstorm, blue, lily, pearl, tan, marine, orange, fresh

Plugins used

The following plugins are utilized in this project:

Rollup:

• @rollup/plugin-babel
• rollup-plugin-filesize

Babel:

• @babel/plugin-transform-runtime

Licence

MIT

• Avatars are designed by different designers, whose names are available in documentation website (under construction).