Vue

The official Vue package for Tabler Icons. Every icon is a component, so only the icons you import end up in the bundle.

Tabler Icons for Vue

Installation

npm install @tabler/icons-vue
yarn add @tabler/icons-vue
pnpm install @tabler/icons-vue
bun install @tabler/icons-vue

or just download from Github.

How to use

Each icon is a Vue component that renders an SVG. The package ships as ES modules, so only the icons you import end up in the bundle.

<template>
  <IconHome />
</template>

<script>
  // Returns Vue component
  import { IconHome } from '@tabler/icons-vue';

  export default {
    components: {
      IconHome
    }
  };
</script>

You can pass additional props to adjust the icon.

<IconHome color="red" :size="48" stroke-width="1" />

Props

All icon components accept these props to control the size, color, and stroke width of the rendered SVG:

name type default
size Number 24
color String currentColor
stroke Number 2