> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/react-icons/react-icons/llms.txt
> Use this file to discover all available pages before exploring further.

# All Icon Libraries

> Complete reference of all 30+ icon libraries available in React Icons

React Icons provides access to over 40,000 SVG icons from 30+ popular icon libraries. Browse the complete list below to find the perfect icons for your project.

## Quick Reference

All icons are imported from `react-icons/[library-id]` with a consistent naming pattern.

<Note>
  Each library uses a unique prefix to avoid naming conflicts. For example, Font Awesome uses `Fa`, Material Design uses `Md`, and Heroicons use `Hi`.
</Note>

## Complete Library List

### Popular Libraries

<CardGroup cols={2}>
  <Card title="Font Awesome 6" href="/icon-libraries/font-awesome">
    **2,045 icons** • `react-icons/fa6`

    Most popular icon library with comprehensive coverage

    **License:** CC BY 4.0
  </Card>

  <Card title="Material Design Icons" href="/icon-libraries/material-design">
    **4,341 icons** • `react-icons/md`

    Google's official Material Design icon system

    **License:** Apache 2.0
  </Card>

  <Card title="Heroicons 2" href="/icon-libraries/heroicons">
    **888 icons** • `react-icons/hi2`

    Beautiful hand-crafted icons from Tailwind Labs

    **License:** MIT
  </Card>

  <Card title="Bootstrap Icons" href="/icon-libraries/bootstrap">
    **2,716 icons** • `react-icons/bs`

    Official icon library for Bootstrap framework

    **License:** MIT
  </Card>
</CardGroup>

### All Libraries

| Library                                                                 | Icons | Import            | Prefix                             | License      |
| ----------------------------------------------------------------------- | ----- | ----------------- | ---------------------------------- | ------------ |
| [Ant Design Icons](https://github.com/ant-design/ant-design-icons)      | 831   | `react-icons/ai`  | `AiFill`, `AiOutline`, `AiTwotone` | MIT          |
| [Bootstrap Icons](https://github.com/twbs/icons)                        | 2,716 | `react-icons/bs`  | `Bs`, `BsFill`                     | MIT          |
| [BoxIcons](https://github.com/atisawd/boxicons)                         | 1,634 | `react-icons/bi`  | `Bi`, `BiSolid`, `BiLogo`          | MIT          |
| [Circum Icons](https://circumicons.com/)                                | 288   | `react-icons/ci`  | `Ci`                               | MPL-2.0      |
| [css.gg](https://github.com/astrit/css.gg)                              | 704   | `react-icons/cg`  | `Cg`                               | MIT          |
| [Devicons](https://vorillaz.github.io/devicons/)                        | 192   | `react-icons/di`  | `Di`                               | MIT          |
| [Feather](https://feathericons.com/)                                    | 287   | `react-icons/fi`  | `Fi`                               | MIT          |
| [Flat Color Icons](https://github.com/icons8/flat-color-icons)          | 329   | `react-icons/fc`  | `Fc`                               | MIT          |
| [Font Awesome 5](https://fontawesome.com/)                              | 1,612 | `react-icons/fa`  | `Fa`, `FaReg`                      | CC BY 4.0    |
| [Font Awesome 6](https://fontawesome.com/)                              | 2,045 | `react-icons/fa6` | `Fa`, `FaReg`                      | CC BY 4.0    |
| [Game Icons](https://game-icons.net/)                                   | 4,040 | `react-icons/gi`  | `Gi`                               | CC BY 3.0    |
| [Github Octicons](https://octicons.github.com/)                         | 264   | `react-icons/go`  | `Go`                               | MIT          |
| [Grommet-Icons](https://github.com/grommet/grommet-icons)               | 635   | `react-icons/gr`  | `Gr`                               | Apache 2.0   |
| [Heroicons](https://github.com/tailwindlabs/heroicons)                  | 460   | `react-icons/hi`  | `Hi`, `HiOutline`                  | MIT          |
| [Heroicons 2](https://github.com/tailwindlabs/heroicons)                | 888   | `react-icons/hi2` | `Hi`, `HiOutline`, `HiMini`        | MIT          |
| [IcoMoon Free](https://github.com/Keyamoon/IcoMoon-Free)                | 491   | `react-icons/im`  | `Im`                               | CC BY 4.0    |
| [Ionicons 4](https://ionicons.com/)                                     | 696   | `react-icons/io`  | `Io`                               | MIT          |
| [Ionicons 5](https://ionicons.com/)                                     | 1,332 | `react-icons/io5` | `Io`                               | MIT          |
| [Icons8 Line Awesome](https://icons8.com/line-awesome)                  | 1,544 | `react-icons/lia` | `Lia`                              | MIT          |
| [Lucide](https://lucide.dev/)                                           | 1,215 | `react-icons/lu`  | `Lu`                               | ISC          |
| [Material Design Icons](http://google.github.io/material-design-icons/) | 4,341 | `react-icons/md`  | `Md`, `MdOutline`                  | Apache 2.0   |
| [Phosphor Icons](https://github.com/phosphor-icons/core)                | 9,072 | `react-icons/pi`  | `Pi`                               | MIT          |
| [Radix Icons](https://icons.radix-ui.com)                               | 318   | `react-icons/rx`  | `Rx`                               | MIT          |
| [Remix Icon](https://github.com/Remix-Design/RemixIcon)                 | 2,860 | `react-icons/ri`  | `Ri`                               | Apache 2.0   |
| [Simple Icons](https://simpleicons.org/)                                | 3,209 | `react-icons/si`  | `Si`                               | CC0 1.0      |
| [Simple Line Icons](https://thesabbir.github.io/simple-line-icons/)     | 189   | `react-icons/sl`  | `Sl`                               | MIT          |
| [Tabler Icons](https://github.com/tabler/tabler-icons)                  | 5,237 | `react-icons/tb`  | `Tb`, `TbFilled`                   | MIT          |
| [Themify Icons](https://github.com/lykmapipo/themify-icons)             | 352   | `react-icons/tfi` | `Tfi`                              | MIT          |
| [Typicons](http://s-ings.com/typicons/)                                 | 336   | `react-icons/ti`  | `Ti`                               | CC BY-SA 3.0 |
| [VS Code Icons](https://github.com/microsoft/vscode-codicons)           | 461   | `react-icons/vsc` | `Vsc`                              | CC BY 4.0    |
| [Weather Icons](https://erikflowers.github.io/weather-icons/)           | 219   | `react-icons/wi`  | `Wi`                               | SIL OFL 1.1  |

## Libraries by Category

### Design Systems

<Tabs>
  <Tab title="Material Design">
    ```jsx theme={null}
    import { MdHome, MdOutlineHome } from 'react-icons/md';
    ```

    **4,341 icons** from Google's Material Design system

    * Filled and outlined variants
    * Perfect for Material-UI projects
  </Tab>

  <Tab title="Bootstrap">
    ```jsx theme={null}
    import { BsHeart, BsFillHeartFill } from 'react-icons/bs';
    ```

    **2,716 icons** for Bootstrap projects

    * Outline and filled variants
    * Matches Bootstrap components
  </Tab>

  <Tab title="Ant Design">
    ```jsx theme={null}
    import { AiFillHome, AiOutlineHome, AiTwotoneHome } from 'react-icons/ai';
    ```

    **831 icons** from Ant Design

    * Filled, outline, and two-tone variants
  </Tab>
</Tabs>

### Modern & Minimal

<Tabs>
  <Tab title="Heroicons">
    ```jsx theme={null}
    import { HiHome, HiOutlineHome, HiMiniHome } from 'react-icons/hi2';
    ```

    **888 icons** from Tailwind Labs

    * 24px solid, 24px outline, 20px mini
    * Hand-crafted with attention to detail
  </Tab>

  <Tab title="Feather">
    ```jsx theme={null}
    import { FiHome, FiUser, FiSettings } from 'react-icons/fi';
    ```

    **287 icons** with simple, beautiful design

    * 24x24 grid, 2px stroke
    * Consistent and minimal
  </Tab>

  <Tab title="Lucide">
    ```jsx theme={null}
    import { LuHome, LuUser, LuSettings } from 'react-icons/lu';
    ```

    **1,215 icons** - Feather fork with more icons

    * Same design language as Feather
    * Community-maintained
  </Tab>
</Tabs>

### Comprehensive Collections

<Tabs>
  <Tab title="Font Awesome">
    ```jsx theme={null}
    import { FaBeer, FaRegHeart, FaGithub } from 'react-icons/fa6';
    ```

    **2,045 icons** - Most popular icon library

    * Solid and regular variants
    * Extensive brand icons
  </Tab>

  <Tab title="Tabler Icons">
    ```jsx theme={null}
    import { TbHome, TbHomeFilled } from 'react-icons/tb';
    ```

    **5,237 icons** - Huge collection

    * Outline and filled variants
    * Consistent design
  </Tab>

  <Tab title="Phosphor Icons">
    ```jsx theme={null}
    import { PiHouse, PiUser, PiGear } from 'react-icons/pi';
    ```

    **9,072 icons** - Largest collection

    * Multiple weights available
    * Flexible design
  </Tab>
</Tabs>

### Specialized Collections

<Tabs>
  <Tab title="Brand Logos">
    ```jsx theme={null}
    import { SiReact, SiTypescript, SiGithub } from 'react-icons/si';
    ```

    **Simple Icons** - 3,209 brand logos

    * Official brand colors
    * SVG format
  </Tab>

  <Tab title="Game Icons">
    ```jsx theme={null}
    import { GiSword, GiShield, GiPotion } from 'react-icons/gi';
    ```

    **Game Icons** - 4,040 gaming icons

    * RPG, fantasy, sci-fi themes
    * Great for game UIs
  </Tab>

  <Tab title="Weather">
    ```jsx theme={null}
    import { WiDaySunny, WiRain, WiSnow } from 'react-icons/wi';
    ```

    **Weather Icons** - 219 weather conditions

    * All weather scenarios
    * Day/night variants
  </Tab>

  <Tab title="Developer Tools">
    ```jsx theme={null}
    import { VscCode, VscTerminal, VscGit } from 'react-icons/vsc';
    import { DiJavascript, DiReact, DiGit } from 'react-icons/di';
    ```

    **VS Code Icons** - 461 editor icons
    **Devicons** - 192 developer icons
  </Tab>
</Tabs>

## Choosing the Right Library

### By Project Type

**Material-UI / MUI Projects**

```jsx theme={null}
import { MdHome } from 'react-icons/md';
```

Use Material Design icons for consistent theming

**Bootstrap Projects**

```jsx theme={null}
import { BsHeart } from 'react-icons/bs';
```

Use Bootstrap Icons for seamless integration

**Tailwind CSS Projects**

```jsx theme={null}
import { HiHome } from 'react-icons/hi2';
```

Use Heroicons - made by the Tailwind team

**Minimal/Modern UIs**

```jsx theme={null}
import { FiHome } from 'react-icons/fi';
import { LuHome } from 'react-icons/lu';
```

Use Feather or Lucide for clean aesthetics

### By Use Case

**Need Many Icons**

* Phosphor (9,072 icons)
* Tabler (5,237 icons)
* Material Design (4,341 icons)

**Need Brand Logos**

* Simple Icons (3,209 brands)
* Font Awesome (hundreds of brands)

**Need Gaming Icons**

* Game Icons (4,040 icons)

**Need Weather Icons**

* Weather Icons (219 conditions)

**Need Developer Icons**

* VS Code Icons (461 icons)
* Devicons (192 icons)

## Icon Comparison

### Design Styles

| Library         | Style             | Best For              |
| --------------- | ----------------- | --------------------- |
| Heroicons       | Modern, minimal   | Tailwind CSS projects |
| Feather         | Simple, elegant   | Clean, minimal UIs    |
| Material Design | Bold, geometric   | Material-UI projects  |
| Font Awesome    | Varied, familiar  | General-purpose       |
| Bootstrap Icons | Clean, consistent | Bootstrap projects    |
| Phosphor Icons  | Flexible, modern  | Large-scale projects  |

### Icon Variants

| Library         | Variants Available                  |
| --------------- | ----------------------------------- |
| Heroicons 2     | Solid 24px, Outline 24px, Mini 20px |
| Material Design | Filled, Outlined                    |
| Font Awesome    | Solid, Regular (outline)            |
| Bootstrap       | Outline, Filled                     |
| Ant Design      | Filled, Outlined, Two-tone          |
| Feather         | Outline only                        |
| Tabler          | Outline, Filled                     |

## Import Examples

### Single Icon

```jsx theme={null}
import { FaBeer } from 'react-icons/fa6';

function App() {
  return <FaBeer />;
}
```

### Multiple Icons from Same Library

```jsx theme={null}
import { MdHome, MdUser, MdSettings } from 'react-icons/md';

function Navigation() {
  return (
    <nav>
      <MdHome />
      <MdUser />
      <MdSettings />
    </nav>
  );
}
```

### Icons from Multiple Libraries

```jsx theme={null}
import { FaGithub } from 'react-icons/fa6';
import { SiTypescript, SiReact } from 'react-icons/si';
import { MdCode } from 'react-icons/md';

function TechStack() {
  return (
    <div>
      <FaGithub />
      <SiTypescript />
      <SiReact />
      <MdCode />
    </div>
  );
}
```

## License Information

<Note>
  Each icon library has its own license. Make sure to check the license requirements for your use case.
</Note>

### Permissive Licenses (Commercial Use OK)

**MIT License** - Most permissive

* Font Awesome (with attribution)
* Bootstrap Icons
* Heroicons
* Feather
* And many others

**Apache 2.0** - Similar to MIT

* Material Design Icons
* Remix Icon
* Grommet Icons

**CC0 / Public Domain**

* Simple Icons

### Attribution Required

**CC BY 3.0/4.0**

* Font Awesome (attribution)
* Game Icons
* VS Code Icons

## Resources

<CardGroup cols={2}>
  <Card title="Icon Search" icon="search" href="https://react-icons.github.io/react-icons/">
    Search all 40,000+ icons in one place
  </Card>

  <Card title="Getting Started" icon="rocket" href="/installation">
    Learn how to install and use React Icons
  </Card>

  <Card title="Icon Libraries Overview" icon="layer-group" href="/icon-libraries/overview">
    Learn about import patterns and conventions
  </Card>

  <Card title="GitHub Repository" icon="github" href="https://github.com/react-icons/react-icons">
    View source code and report issues
  </Card>
</CardGroup>