Table of Contents

Installation

Additionally, you will need to have installed a version of styled-components, as styled-icons depends on styled-components as a peer dependency.

Usage
All Font Awesome (free), Feather, Material, and Octicon icons are available for preview at the Icon Explorer.

The entire icon packs are available via the main import and sub-imports:

import {material, octicons} from 'styled-icons'
import * as faBrands from 'styled-icons/fa-brands'
import * as faRegular from 'styled-icons/fa-regular'
import * as faSolid from 'styled-icons/fa-solid'
import * as feather from 'styled-icons/feather'
import * as material from 'styled-icons/material'
import * as octicons from 'styled-icons/octicons'

The icons are also available as individual imports – it is recommended that you import icons individually using ES modules along with a module bundler like Webpack or Rollup in order to enable tree-shaking. This means that the module bundler will remove unused icons from the final JavaScript bundle, saving bandwidth and speeding up loading:

Read the full article on GitHub

We are a world class software startup focusing on building scalable, high-performance web & mobile application. We have started our journey back in 2015. And in those years we have provided support for more than 15 thousand customers over the world. We build products that create values. RedQ, Inc