@acetylcholine/material-icons-react v1.0.0

React MUI Icons is ready and easy-to-use, Typescript-safe React icon components package based on Google's Material Icons.

]github-license-url

• Installation
• Usage
  • Submodule
  • Main Bundle
• License

Installation

# npm
npm install react-mui-icons

# yarn
yarn add react-mui-icons

# pnpm
pnpm add react-mui-icons

Usage

@acetylcholine/material-icons-react provides three Material icon variants in both default and filled types.

Icon variants are:

• Outlined
• Rounded
• Sharp

Icon component support all props that a React svg component supports. There are two ways to import an icon based on your prefered type and variant.

Submodule

// Outlined variant
import { Search } from '@acetylcholine/material-icons-react/outlined'
import { Home } from '@acetylcholine/material-icons-react/outlined/filled'

// Rounded variant
import { Star } from '@acetylcholine/material-icons-react/outlined'
import { Favorite } from '@acetylcholine/material-icons-react/outlined/filled'

// Sharp variant
import { Delete } from '@acetylcholine/material-icons-react/outlined'
import { Login } from '@acetylcholine/material-icons-react/outlined/filled'

// Sample props
<Search className="yourClassName" />
<Home style={{fill: 'red'}} />
<Star height='1rem' width='1rem' />
<Favorite height={16} width={16} />
<Delete fill='red' />
<Login viewBox='0 0 24 24' />

Main Bundle

// Import corresponding variant and type bundles
import { OutlinedIcons, OutlinedFilledIcons, RoundedIcons, RoundedFilledIcons, SharpIcons, SharpFilledIcons} from '@acetylcholine/material-icons-react'

// Sample props
<OutlinedIcons.Search className="yourClassName" />
<OutlinedFilledIcons.Home style={{fill: 'red'}} />
<RounededIcons.Star height='1rem' width='1rem' />
<RounededFilledIcons.Favorite height={16} width={16} />
<SharpIcons.Delete fill='red' />
<SharpFilledIcons.Login viewBox='0 0 24 24' />

License

Material design icons are created by Google.

We have made these icons available for you to incorporate into your products under the Apache License Version 2.0. Feel free to remix and re-share these icons and documentation in your products. We'd love attribution in your app's about screen, but it's not required.