@tabler/icons

Tabler Icons

A set of 5963 free MIT-licensed high-quality SVG icons for you to use in your web projects. Each icon is designed on a 24x24 grid and a 2px stroke.

Browse all icons at tabler-icons.io →

Sponsors

If you want to support my project and help me grow it, you can become a sponsor on GitHub or just donate on PayPal :)

Installation

yarn add @tabler/icons

or

npm install @tabler/icons

or

pnpm install @tabler/icons

or just download from Github.

Usage

All icons are built with SVG, so you can place them as <img>, background-image and inline in HTML code.

HTML image

If you load an icon as an image, you can modify its size using CSS.

<img src="path/to/icon.svg" alt="icon title" />

Inline HTML

You can paste the content of the icon file into your HTML code to display it on the page.

<a href="">
  <svg
    xmlns="http://www.w3.org/2000/svg"
    class="icon icon-tabler icon-tabler-disabled"
    width="24"
    height="24"
    viewBox="0 0 24 24"
    stroke-width="1.25"
    stroke="currentColor"
    fill="none"
    stroke-linecap="round"
    stroke-linejoin="round"
  >
    ...
  </svg>
  Click me
</a>

Thanks to that, you can change the size, color and the stroke-width of the icons with CSS code.

.icon-tabler {
  color: red;
  width: 32px;
  height: 32px;
  stroke-width: 1.25;
}

Contributing

For more info on how to contribute please see the contribution guidelines.

Caught a mistake or want to contribute to the documentation? Edit this page on Github

License

Tabler Icons is licensed under the MIT License.

Sponsor Tabler

Similar packages

Other packages similar to @tabler/icons

react-icons

react-icons is a popular package that provides a wide range of icons from various icon libraries, including Font Awesome, Material Design, and more. It offers a similar level of customization and ease of use as @tabler/icons, but with a broader selection of icon styles.

heroicons

heroicons is a set of free, MIT-licensed high-quality SVG icons for you to use in your web projects. It is similar to @tabler/icons in terms of simplicity and design consistency, but it offers a different style and a smaller selection of icons.

feather-icons

feather-icons is a collection of simply beautiful open-source icons. Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency, and readability. It is comparable to @tabler/icons in terms of design philosophy and ease of use.