Installation | Usage | Examples | Browse icons
Because it is:
- 📦 Tiny - each downloaded svg is optimized by svgo and minified. This results in 0.5 kilobytes icon size in average.
- 🌳 Tree shakable - your app won't grow dramatically, metro will automatically throw out unused icons from the bundle, resulting in small bundle size.
- 💪 Strongly typed - comes with TypeScript declarations, which will help you avoid common mistakes.
- 👋 Developer-friendly - doesn't require any additional configuration - simply install react-native-svg as well as this package, and instantly begin using awesome icons.
Install react-native-svg
as well as this package:
npm i react-native-svg native-material-icons
Or with yarn:
yarn add react-native-svg native-material-icons
// Filled style
import { LightbulbIcon } from 'native-material-icons';
// Outlined style
import { LightbulbOutlinedIcon } from 'native-material-icons';
// Rounded style
import { LightbulbRoundIcon } from 'native-material-icons';
// Sharp style
import { LightbulbSharpIcon } from 'native-material-icons';
// Two tone style
import { LightbulbTwoToneIcon } from 'native-material-icons';
Or:
// Filled style
import LightbulbIcon from 'native-material-icons/LightbulbIcon';
// Outlined style
import LightbulbOutlinedIcon from 'native-material-icons/LightbulbOutlinedIcon';
// Rounded style
import LightbulbRoundIcon from 'native-material-icons/LightbulbRoundIcon';
// Sharp style
import LightbulbSharpIcon from 'native-material-icons/LightbulbSharpIcon';
// Two tone style
import LightbulbTwoToneIcon from 'native-material-icons/LightbulbTwoToneIcon';
Usage with Native Base:
import { Icon } from 'native-base';
import LightbulbIcon from 'native-material-icons/LightbulbIcon';
const App = () => {
return (
<Icon
/* Specify icon component */
as={LightbulbIcon}
/* Supports color */
color="gray.500"
/* Supports sizes */
size="md"
/>
);
};
Icons are downloaded from Google Fonts, so you can find all icons there.
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
Please make sure to update tests as appropriate.
MIT © Artiom Tretjakovas