# @storybook/icons

> Icon library from the Storybook team

Latest version **2.1.0** (published 2026-06-25) · MIT license · 0 weekly downloads

## Install

```sh
npm install @storybook/icons
pnpm add @storybook/icons
yarn add @storybook/icons
bun add @storybook/icons
```

## Health

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

Positive: esm support; no vulnerabilities; has provenance; recently updated; high maintenance score.

Warnings: low downloads; no types.

## Facts

| | |
|---|---|
| Version | 2.1.0 |
| Published | 2026-06-25 |
| First published | 2023-07-18 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM |
| Dependencies | 0 |
| Unpacked size | 335.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 23 |
| Author | cdedreuille |
| Maintainers | ndelangen, shilman, tmeasday, ghengeveld, winkervsbecks, yannbf, kylegach, jreinhold, kasperpeulen, valentinpalkovic, domyen, storybook-bot |

## Links

- npm: https://www.npmjs.com/package/@storybook/icons
- Repository: https://github.com/storybookjs/icons
- Homepage: https://github.com/storybookjs/icons#readme
- Issues: https://github.com/storybookjs/icons/issues
- npm.io page: https://npm.io/package/@storybook/icons

## Recent versions

- 2.1.0 (latest) — 2026-06-25
- 1.5.2--canary.0307e96.0 (canary) — 2025-09-16
- 2.0.2 — 2026-05-05
- 2.0.1 — 2025-11-13
- 1.6.0 — 2025-09-16
- 1.5.1 — 2025-09-16
- 1.5.1--canary.7a7a12a.0 — 2025-09-15
- 1.5.0 — 2025-09-15
- 1.5.0--canary.41.a0d23b0.0 — 2025-09-15
- 1.4.0 — 2025-03-07
- 1.3.3--canary.40.d3af850.0 — 2025-03-07
- 1.3.2 — 2025-01-23
- 1.3.2--canary.38.48ca671.0 — 2025-01-23
- 1.3.2--canary.37.93fd550.0 — 2025-01-23
- 1.3.1 — 2025-01-22
- … 85 more at https://npm.io/package/@storybook/icons/versions

## README

# Icons

<img src="public/cover.jpg" />

This library contains the icons used in Storybook and Chromatic apps and marketing sites. They are 14x14. To view the list of all available icons, please go to https://main--64b56e737c0aeefed9d5e675.chromatic.com/

## Install

npm:

```console
npm install @storybook/icons
```

yarn:

```console
yarn add @storybook/icons
```

pnpm:

```console
pnpm add @storybook/icons
```

## To Do

- [x] Export every single icon instead of a single component
- [x] Add stories for each component

## Generating new icons from Figma

First, set local environment variables:

```console
FIGMA_API_TOKEN=<YOUR_FIGMA_API_TOKEN>
FIGMA_FILE_ID=<FIGMA_FILE_ID>
FIGMA_CANVAS=Icons
```

Then, fetch all icons from Figma locally and create React components + stories automatically:

```console
pnpm generate-icons
```

Inspired by [this article](https://blog.certa.dev/generating-react-icon-components-from-figma).

## Developing

Watch and rebuild code with `tsup` and run Storybook to preview your UI during development:

```console
pnpm storybook
```

## Building

Build package with `tsup` for production:

```console
pnpm build
```

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