# @fluentui/react-icons

> Fluent System Icons are a collection of familiar, friendly, and modern icons from Microsoft.

Latest version **2.0.343** (published 2026-09-25) · MIT license · 0 weekly downloads

## Install

```sh
npm install @fluentui/react-icons
pnpm add @fluentui/react-icons
yarn add @fluentui/react-icons
bun add @fluentui/react-icons
```

## Health

**Score 75/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score; high quality score; popular repo.

Warnings: low downloads; large bundle.

## Facts

| | |
|---|---|
| Version | 2.0.343 |
| Published | 2026-09-25 |
| First published | 2020-04-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 165.8 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 10876 |
| Maintainers | uifabricteam, uifrnbot, microsoft1es, microsoft-oss-releases |

## Links

- npm: https://www.npmjs.com/package/@fluentui/react-icons
- Repository: https://github.com/microsoft/fluentui-system-icons
- Homepage: https://github.com/microsoft/fluentui-system-icons#readme
- Issues: https://github.com/microsoft/fluentui-system-icons/issues
- npm.io page: https://npm.io/package/@fluentui/react-icons

## Dependencies (2)

- [tslib](https://npm.io/package/tslib.md) ^2.1.0
- [@griffel/react](https://npm.io/package/@griffel/react.md) ^1.6.1

## Recent versions

- 2.0.343 (latest) — 2026-09-25
- 2.0.333-alpha.0 (prerelease) — 2026-07-10
- 0.4.11 (lts-7) — 2022-10-31
- 2.0.173-rc.9 (rc) — 2022-06-17
- 2.0.166-rc.3 (beta) — 2022-04-08
- 2.0.342 — 2026-09-25
- 2.0.341 — 2026-09-11
- 2.0.340 — 2026-09-10
- 2.0.339 — 2026-08-26
- 2.0.338 — 2026-08-21
- 2.0.337 — 2026-08-13
- 2.0.336 — 2026-08-12
- 2.0.335 — 2026-08-07
- 2.0.334 — 2026-07-24
- 2.0.333 — 2026-07-10
- … 279 more at https://npm.io/package/@fluentui/react-icons/versions

## README

# Fluent UI System Icons

![Pull request validation](https://github.com/microsoft/fluentui-system-icons/actions/workflows/pr.yml/badge.svg)

Fluent UI System Icons are a collection of familiar, friendly and modern icons from Microsoft.

![Fluent System Icons](art/readme-banner.png)

## Icon List

- [View the full list of regular icons](icons_regular.md)

- [View the full list of filled icons](icons_filled.md)

## Direction

Within the metadata.json file for an icon, a property named `directionType` is used to indicate the direction of the icon. This property can have one of the following values:

- `unique`, meaning that the icon is unique and has a specific RTL and LTR version
- `mirror`, meaning that the icon can be mirrored for RTL or LTR languages

The property `singleton` is also used to indicate the default direction that should be used for the icon.

## Installation

### Android

The library is published via Maven Central, please ensure that the `mavenCentral()` repository has been added to the root `build.gradle` file:

```groovy
repositories {
    ...
    mavenCentral()
}
```

Include the following dependency in your project's `build.gradle`:

```groovy
implementation 'com.microsoft.design:fluent-system-icons:1.1.343@aar'
```

For library docs, see [android/README.md](android/README.md).

### iOS and macOS

#### CocoaPods

```ruby
use_frameworks!

pod "FluentIcons", "1.1.343"
```

#### Carthage

```bash
git "git@github.com:microsoft/fluentui-system-icons.git" "1.1.343"
```

For library docs, see [ios/README.md](ios/README.md).

### Flutter

In the `pubspec.yaml` of your flutter project, add the following dependency:

```yaml
dependencies:
  ...
  fluentui_system_icons: ^1.1.343
```

For library docs, see [flutter/README.md](flutter/README.md).

### Plain svg

Inline svg directly. See [packages/svg-icons/README.md](packages/svg-icons/README.md).

## Contributing

### Importer

The importer generates the Android and iOS libraries from the icons in the `assets` directory.

Install dependencies from the repository root (this is a single yarn workspace, so
dependencies for every package are installed in one go):

```
corepack enable
yarn install
```

Jump into the directory:

```
cd importer
yarn clean
```

List all the available commands:

```
yarn run
```

### Build Pipeline

Our [build pipeline](https://github.com/microsoft/fluentui-system-icons/actions) runs `deploy:android` and `deploy:ios` to create the libraries. The build definitions are located in `.github/workflows/`.

## Demo apps

You can build and run the demo apps following the steps below.

### Android

1. Follow the **Importer** section above and run the command `yarn deploy:android`
2. Open the [android](android) directory in Android Studio
3. Select the `sample-showcase` in the build configuration dropdown
4. Click run

### Flutter

Prerequisite: Make sure you have flutter configured in Android Studio

1. Open the [flutter](flutter) directory in Android Studio
2. Select the `example` in the directory and open it in Android Studio
3. Click run

## Contact

Please feel free to [open a GitHub issue](https://github.com/microsoft/fluentui-system-icons/issues/new) and assign to the following points of contact with questions or requests.

- Jason Custer([@jasoncuster](https://github.com/jasoncuster)) / Spencer Nelson([@spencer-nelson](https://github.com/spencer-nelson)) / Joe Woodward([@thewoodpecker](https://github.com/thewoodpecker)) - Design
- Nick Romano([@rickromano](https://github.com/nickromano)) - iOS
- Will Hou([@willhou](https://github.com/willhou)) - Android
- Akashdeep Singh([@aakash1313](https://github.com/aakash1313)) - Flutter

## Code of Conduct

This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct) or contact opencode@microsoft.com with any additional questions or comments.

---
_Source: https://npm.io/package/@fluentui/react-icons · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._