I want to use the material-ui icons in the svg-icons folder I did with npm install, but the implementations of each icon on each js file have different import like the ones in the action or in the editor etc. I had to look through the js file to find how to import each icon. I want a documentation or site that specifically lets me to copy paste the import of each icon.
I was looking for **navigate next**
icon from google design and found it in
import ImageNavigateNext from 'material-ui/svg-icons/image/navigate-next';
You can also use https://material-ui.com/components/material-icons/ to search for the icon you need.
Create an icon buttonImport the IconButton component from the Material-UI core package. import IconButton from '@material-ui/core/IconButton'; Render the icon as a child component to the IconButton . You can also move the color prop to the IconButton .
Pre v1
You can just look up the category and name on Icons.
Every SvgIcon will map to:
import MyIconName from 'material-ui/svg-icons/<category>/<name>';
For example if I want the account balance icon which is part of the action category I would import.
import BalanceIcon from 'material-ui/svg-icons/action/account-balance';
Notice that spaces will become dashes. So the list you want is on the link above.
v1
With the new version of material-ui the icons are in their own package material-ui-icons. Now you only have to lookup the name and PascalCase it to find the correct name. The category is no longer relevant. So:
import BalanceIcon from 'material-ui/svg-icons/action/account-balance';
Becomes:
import BalanceIcon from 'material-ui-icons/AccountBalance';
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With