@tabler/icons-react

Tabler Icons for React

Implementation of the Tabler Icons library for React applications.

Browse all icons at tabler.io →

Sponsors

If you want to support our project and help us grow it, you can become a sponsor on GitHub or donate on PayPal.

Installation

npm install @tabler/icons-react

yarn add @tabler/icons-react

pnpm add @tabler/icons-react

You can also download the latest release from GitHub.

Usage

The package is built with ES modules, so unused icons are tree-shaken from your bundle. Each icon is exported as a component.

import { IconArrowLeft } from '@tabler/icons-react';

const App = () => {
  return <IconArrowLeft />;
};

export default App;

Pass props to adjust the icon:

<IconArrowLeft color="red" size={48} stroke={1.5} />

Props

Name	Type	Default	Description
size	_number	string_	24
color	string	currentColor	Stroke color for outline icons, fill color for filled icons
stroke	_number	string_	2
title	string	–	Adds a <title> element for accessibility
className	string	–	Extra classes added to tabler-icon tabler-icon-{{name}}

Any other attribute is forwarded to the rendered <svg> element. Components forward refs to the <svg> element and ship with TypeScript declarations.

Contributing

Bug reports and icon requests are welcome in the issue tracker. Caught a mistake in this page? Edit it on GitHub.

License

Tabler Icons is licensed under the MIT License.