DEV Community

Cover image for Modern React Avatar 😎
Fathy
Fathy

Posted on • Edited on

Modern React Avatar 😎

#javascript #react #css #avatar

Newest modern Lightweight Avatar Generator for React 👋

Install

Open your terminal and let's install modern-react-avatar.

npm install --save modern-react-avatar
Enter fullscreen mode Exit fullscreen mode

Usage

  1. Import Custom Element: 
import { Avatar } from 'modern-react-avatar'
import 'modern-react-avatar/dist/index.css'
Enter fullscreen mode Exit fullscreen mode
  1. Start using it! 
<Avatar name="Fathy" />
Enter fullscreen mode Exit fullscreen mode
Some examples: 
<Avatar name="Fathy" shape="square" />
<Avatar name="Fathy" randomColor="true" />
<Avatar name="Fathy" size="large" />
<Avatar icon="true" size="large" alt="alt text" />
<Avatar src="https://via.placeholder.com/150" alt="alt text" />
Enter fullscreen mode Exit fullscreen mode

Well done! 👏

Thanks for reading! Say Hallo! Twitter

Top comments (0)

Read next

jeet_dhandha profile image

Building and Comparing Table Data Made Easy with @libs-jd/table-data-kit

Jeet Dhandha -

chintanonweb profile image

Mastering JavaScript Memory: A Beginner’s Guide to Stack and Heap

chintanonweb -

itschrislojniewski profile image

Next js for E-Learning Platforms

Chris Lojniewski -

pentest_testing_corp profile image

Preventing SQL Injection (SQLi) in React.js Apps

Pentest Testing Corp -