React Icons

Overview

React Icons packages 31 popular icon libraries, more than 50,000 icons in total, as React components in a single npm package. Sets include Lucide, Font Awesome 5 and 6, Material Design, Heroicons 1 and 2, Bootstrap Icons, Remix Icon, Tabler, Phosphor, Ionicons, Feather, Ant Design Icons and GitHub Octicons.

Icons are imported with ES6 imports from a per-library subfolder, such as react-icons/fa or react-icons/md, so bundles include only the icons a project uses. For shadcn/ui projects it is a common way to reach icon sets beyond the default Lucide icons with the same component-style API. The documentation site has a searchable catalog of every icon and its import name.

Features

• 31 icon libraries: Font Awesome, Material Design, Heroicons, Lucide, Bootstrap, Remix Icon, Ionicons and more
• 50,000+ icons: All available from one dependency
• Tree-shakeable imports: Only the icons imported are included in the bundle
• Consistent API: Every icon is a React component that accepts size, color and className props
• Searchable catalog: Browse and search all icons with their import paths on the docs site
• Per-set licenses: Each icon pack keeps its original license, listed in the README

Tech stack

• React
• TypeScript types included

Getting started

npm install react-icons --save

import { FaBeer } from "react-icons/fa";