tabler-icons

by tabler

A set of over 850 free MIT-licensed high-quality SVG icons for you to use in your web projects.

9.2K Stars 416 Forks Last release: 21 days ago (v1.34.0) MIT License 660 Commits 45 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:

Tabler Icons

A set of over 850 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.

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

Preview

Installation

npm install tabler-icons --save

or just download from Github.

Usage

All icons are built with SVG, so you can place them as

,
background-image
and inline in HTML code.

HTML image

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

icon title

Inline HTML

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


  
    ...
  
  Click me

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;
}

SVG sprite

Add an icon to be displayed on your page with the following markup (

activity
in the above example can be replaced with any valid icon name):
  

React

Import the icon and render it in your component. You can adjust SVG properties through React props:

import { IconAward } from 'tabler-icons';

const MyComponent = () => { return }

tabler-icons
exports it's own type declarations for usage with React and Typescript.

Multiple strokes

All icons in this repository have been created with the value of the

stroke-width
property, so if you change the value, you can get different icon variants that will fit in well with your design.

License

Tabler Icons is licensed under the MIT License.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.