Icons are the vital element of the user interface of the product enabling successful and effective interaction with it. So in this post I’ve collected 15 Useful React Icon Components to bring more interactivity, better UI design and also a cleaner code.
React Icons
Include popular icons in your React projects easly with react-icons, which utilizes ES6 imports that allows you to include only the icons that your project is using.
Styled Icons
Popular icon packs like Font Awesome, Material Design, and Octicons, available as React Styled Components.
React Feather
It is a collection of simply beautiful open source icons for React.js. Each icon is designed on a 24×24 grid with an emphasis on simplicity, consistency and readability.
React Social Icons
A set of beautiful svg social icons. Easily used in React. No images or external css dependencies. Svg paths provided by Squarespace.
React Icons Kit
To use react-icons-kit, import the Icon component plus an icon from any of the iconset. You can set the size of an icon using the size attribute. The size attribute can take in percentage instead of a number such that it can use the size of the container.
Iconify React
Iconify is a modern open source SVG alternative to glyph fonts. It is a unified framework, aimed to offer all popular icon sets with one easy to use syntax: Font Awesome, Material Design Icons, Jam Icons and several emoji sets: Noto Emoji, Twemoji, EmojiOne, Firefox OS Emoji.
React Icons
A collection of SVG icons, check out the Demo for the list of icons.
React Icon Factory
Simply add icon SVGs and the react icon factory will manufacture a custom icon component!.
React File Icon
React component that makes it easy to render svg file icons.
React Fa
Font Awesome icons as React components.
React Unicons
1000+ Pixel-perfect vector icons as React Components. These icons are designed by Iconscout.
React Geomicons
React icon component for Geomicons Open.
React Evil Icons
Evil icons as react components.
React Bytesize Icons
Each icon is hand-coded along a 32×32 grid, and uses SVG stroke allowing for maximum style flexibility; meaning you can adjust the weight, color, size, and if you want the edges to be round or square.
React Material Icons
Simple component for animated Material Icons in React. Fine works with react 15.0 or later.