![\"Tabler](\"https://raw.githubusercontent.com/tabler/tabler-icons/main/.github/packages/og-package-angular.png\"){kind=icon}
\n\n \n
\n Implementation of the Tabler Icons library for Angular applications.\n
\n\n\n Browse all icons at tabler.io →\n
\n\n\n ![\"Latest](\"https://img.shields.io/npm/v/@tabler/icons-angular\"){kind=icon}
![\"License\"](\"https://img.shields.io/npm/l/@tabler/icons-angular.svg\"){kind=icon}
\n
![\"Tabler](\"https://cdn.jsdelivr.net/gh/tabler/sponsors@latest/sponsors.svg\")
\n\n\n## Prerequisites\n\n- **Angular:** `>=21.0.0` (`@angular/core` and `@angular/common`).\n\n## Installation\n\n```sh\nnpm install @tabler/icons-angular\n```\n\n```sh\nyarn add @tabler/icons-angular\n```\n\n```sh\npnpm add @tabler/icons-angular\n```\n\nYou can also [download the latest release from GitHub](https://github.com/tabler/tabler-icons/releases).\n\n## Usage\n\nThe package is built with ES modules and is tree-shakable. You choose which icons to include.\n\nYou can provide icons via `provideTablerIcons()`, or pass `TablerIcon` objects directly to the component.\n\nIcons are exported as `Icon…` named symbols from `@tabler/icons-angular`. Legacy/alternate names are re-exported from the same package as additional `Icon…` symbols (e.g. `Icon123`).\n\n### I. Using the provider (icon names in templates)\n\n#### 1a. Standalone applications (recommended)\n\nIn `main.ts`:\n\n```ts\nimport { provideTablerIcons, IconBrandAngular, IconHome } from '@tabler/icons-angular';\n\nbootstrapApplication(AppComponent, {\n providers: [\n provideTablerIcons({ IconBrandAngular, IconHome })\n ]\n});\n```\n\nAdd any number of icons by including more `Icon*` imports in the object passed to `provideTablerIcons()`.\n\nOr in a route configuration:\n\n```ts\nimport { IconBrandAngular, provideTablerIcons } from '@tabler/icons-angular';\n\nexport const routes: Routes = [\n {\n path: 'demo',\n component: DemoComponent,\n providers: [provideTablerIcons({ IconBrandAngular })]\n }\n];\n```\n\nIn any component that uses icons, import `TablerIconComponent` into that component’s `imports` array (standalone-style components, including the root app component):\n\n```ts\nimport { TablerIconComponent } from '@tabler/icons-angular';\n\n@Component({\n imports: [TablerIconComponent],\n // ...\n})\nexport class DemoComponent {}\n```\n\n#### 1b. NgModule-based applications\n\nAngular 21 still supports `NgModule`. Import `TablerIconComponent` into the module’s `imports` and register `provideTablerIcons()` / `provideTablerIconConfig()` in the module’s `providers` the same way as with `bootstrapApplication`.\n\n```ts\nimport { TablerIconComponent, provideTablerIcons, IconBrandAngular, IconHome } from '@tabler/icons-angular';\n\n@NgModule({\n imports: [TablerIconComponent],\n providers: [provideTablerIcons({ IconBrandAngular, IconHome })],\n // ...\n})\nexport class AppModule {}\n```\n\n#### 2. Use the icon in a template (by name)\n\n```html\n