# bootstrap-icons

> Official open source SVG icon library for Bootstrap

Latest version **1.13.1** (published 2025-05-09) · MIT license · 0 weekly downloads

## Install

```sh
npm install bootstrap-icons
pnpm add bootstrap-icons
yarn add bootstrap-icons
bun add bootstrap-icons
```

## Health

**Score 40/100 (D)** — status: stable.

Positive: no vulnerabilities; high maintenance score.

Warnings: low downloads; no types; no esm support.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 1.13.1 |
| Published | 2025-05-09 |
| First published | 2019-11-26 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 2.9 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 8126 |
| Author | mdo |
| Maintainers | bootstrap-admin, mdo, xhmikosr |
| Keywords | bootstrap, icons, svg, font, sprite, woff, woff2 |

## Links

- npm: https://www.npmjs.com/package/bootstrap-icons
- Repository: https://github.com/twbs/icons
- Homepage: https://icons.getbootstrap.com/
- Issues: https://github.com/twbs/icons/issues
- Funding: https://github.com/sponsors/twbs
- npm.io page: https://npm.io/package/bootstrap-icons

## Alternatives

- [@fortawesome/react-fontawesome](https://npm.io/package/@fortawesome/react-fontawesome.md) — 2.2M weekly downloads
- [roboto-fontface](https://npm.io/package/roboto-fontface.md) — 196.0K weekly downloads
- [@react-native-vector-icons/common](https://npm.io/package/@react-native-vector-icons/common.md) — 150.4K weekly downloads
- [@procore/core-icons](https://npm.io/package/@procore/core-icons.md) — 4.6K weekly downloads
- [@react-md/material-icons](https://npm.io/package/@react-md/material-icons.md) — 1.6K weekly downloads

## Recent versions

- 1.13.1 (latest) — 2025-05-09
- 1.13.0 — 2025-05-09
- 1.12.1 — 2025-05-04
- 1.12.0 — 2025-05-04
- 1.11.4 — 2025-05-03
- 1.11.3 — 2024-01-03
- 1.11.2 — 2023-11-21
- 1.11.1 — 2023-09-17
- 1.11.0 — 2023-09-12
- 1.10.5 — 2023-04-26
- 1.10.4 — 2023-04-03
- 1.10.3 — 2022-12-27
- 1.10.2 — 2022-11-13
- 1.10.1 — 2022-11-12
- 1.10.0 — 2022-11-11
- … 25 more at https://npm.io/package/bootstrap-icons/versions

## README

<p align="center">
  <a href="https://getbootstrap.com/">
    <img src="https://getbootstrap.com/docs/5.2/assets/brand/bootstrap-logo-shadow.png" alt="Bootstrap logo" width="200" height="165">
  </a>
</p>

<h3 align="center">Bootstrap Icons</h3>

<p align="center">
  Official open source SVG icon library for Bootstrap with over 2,000 icons.
  <br>
  <a href="https://icons.getbootstrap.com/"><strong>Explore Bootstrap Icons »</strong></a>
  <br>
  <br>
  <a href="https://getbootstrap.com/">Bootstrap</a>
  ·
  <a href="https://themes.getbootstrap.com/">Themes</a>
  ·
  <a href="https://blog.getbootstrap.com/">Blog</a>
  <br>
</p>

[![Bootstrap Icons preview](https://github.com/twbs/icons/blob/main/.github/preview.png)](https://icons.getbootstrap.com/)

## Install

Bootstrap Icons are packaged up and published to npm. We only include the processed SVGs in this package—it's up to you and your team to implement. [Read our docs](https://icons.getbootstrap.com/) for usage instructions.

```shell
npm i bootstrap-icons
```

For those [using Packagist](https://packagist.org/packages/twbs/bootstrap-icons), you can also install Bootstrap Icons via Composer:

```shell
composer require twbs/bootstrap-icons
```

[Also available in Figma](https://www.figma.com/community/file/1042482994486402696/Bootstrap-Icons).

## Usage

Depending on your setup, you can include Bootstrap Icons in a handful of ways.

- Copy-paste SVGs as embedded HTML
- Reference via `<img>` element
- Use the SVG sprite
- Include via CSS

[See the docs for more information](https://icons.getbootstrap.com/#usage).

## Development

[![Build Status](https://img.shields.io/github/actions/workflow/status/twbs/icons/test.yml?branch=main&label=Tests&logo=github)](https://github.com/twbs/icons/actions/workflows/test.yml?query=workflow%3ATests+branch%3Amain)
[![npm version](https://img.shields.io/npm/v/bootstrap-icons?logo=npm&logoColor=fff)](https://www.npmjs.com/package/bootstrap-icons)

Clone the repo, install dependencies, and start the Hugo server locally.

```shell
git clone https://github.com/twbs/icons/
cd icons
npm i
npm start
```

Then open `http://localhost:4000` in your browser.

### npm scripts

Here are some key scripts you'll use during development. Be sure to look to our `package.json` or `npm run` output for a complete list of scripts.

| Script       | Description                                                                   |
|--------------|-------------------------------------------------------------------------------|
| `start`      | Alias for running `docs-serve`                                                |
| `docs-serve` | Starts a local Hugo server                                                    |
| `pages`      | Generates permalink pages for each icon with template Markdown                |
| `icons`      | Processes and optimizes SVGs in `icons` directory, generates fonts and sprite |

## Adding SVGs

Icons are typically only added by @mdo, but exceptions can be made. New glyphs are designed in Figma first on a 16x16px grid, then exported as flattened SVGs with `fill` (no stroke). Once a new SVG icon has been added to the `icons` directory, we use an npm script to:

1. Optimize our SVGs with SVGO.
2. Modify the SVGs source code, removing all attributes before setting new attributes and values in our preferred order.

Use `npm run icons` to run the script, run `npm run pages` to build permalink pages, complete those pages, and, finally, commit the results in a new branch for updating.

**Warning**: Please exclude any auto-generated files, like `font/**` and `bootstrap-icons.svg` from your branch because they cause conflicts, and we generally update the dist files before a release.

## Publishing

Documentation is published automatically when a new Git tag is published. See our [GitHub Actions](https://github.com/twbs/icons/tree/main/.github/workflows) and [`package.json`](https://github.com/twbs/icons/blob/main/package.json) for more information.

## License

[MIT](LICENSE)

## Author

[@mdo](https://github.com/mdo)

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