material-react-icons v4.0.0

material-react-icons

This package provides all the Material Design Icons by Google, as React SVG Components. The main inspiration for this package is from @material-ui/icons, the only difference being that the latter depends on the Material-UI's SvgIcon React Component, while this package boasts zero dependencies.

All the icons, included in the package can be found here.

Installation

  npm install material-react-icons

Usage

The import path for each Material icon component includes the icon name in PascalCase. For example 'access_alarm' icon is named as 'AccessAlarm'

Note: One exception is '3d rotation', which is named 'ThreeDRotation'.

1. Recommended Way

  import AddIcon from 'material-react-icons/Add';
  import RemoveIcon from 'material-react-icons/Remove';
  ...
  ...
    render() {
      ...
      return (
        ...
        <AddIcon />
        <RemoveIcon />
        ...
      );
  ...
  }

2. With tree-shaking configured

import { Add, Remove } from 'material-react-icons';
...
  ...
    render() {
      ...
      return (
        ...
        <Add />
        <Remove />
        ...
      );
  ...
  }

Props

Note: Any other prop passed will be spread on to the root element (<svg />).

Default Inline Styles of the Icon Component (Can be overridden by styles prop)

  {
    userSelect: 'none',
    width: '100%',
    fill: 'currentColor',
    height: '1em',
    verticalAlign: 'middle',
    width: '1em'
  }

Note: The size of the icon can be adjusted font-size CSS property. (24px is the default size).

Peer Dependencies

• react
• prop-types

License

This project is licensed under the terms of the MIT license.