Svelte

The official Svelte package for Tabler Icons. Every icon is a component with size, color and stroke props.

Installation

npm install @tabler/icons-svelte

yarn add @tabler/icons-svelte

pnpm install @tabler/icons-svelte

bun install @tabler/icons-svelte

or just download from Github.

How to use

Each icon is a component, and the package ships as ES modules, so only the icons you import end up in the bundle.

<script lang="ts">
  import { IconHeart } from "@tabler/icons-svelte";
</script>
<main>
  <IconHeart />
</main>

You can pass additional props to adjust the icon.

<IconHeart size="{48}" stroke="{1}" />

Props

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