https://github.com/naokim03/tabler-icons-svelte-with-tailwindcss

A library of SVG Svelte components for Tabler Icons. This library is designed to be used with TailwindCSS.
https://github.com/naokim03/tabler-icons-svelte-with-tailwindcss

icons svelte svelte-components sveltejs svg svg-icons svgs tabler-icons tailwindcss

Last synced: about 1 month ago
JSON representation

A library of SVG Svelte components for Tabler Icons. This library is designed to be used with TailwindCSS.

• Host: GitHub
• URL: https://github.com/naokim03/tabler-icons-svelte-with-tailwindcss
• Owner: NaokiM03
• License: other
• Archived: true
• Created: 2022-04-26T06:43:39.000Z (over 2 years ago)
• Default Branch: master
• Last Pushed: 2023-06-20T13:48:30.000Z (over 1 year ago)
• Last Synced: 2024-09-30T15:48:37.742Z (about 1 month ago)
• Topics: icons, svelte, svelte-components, sveltejs, svg, svg-icons, svgs, tabler-icons, tailwindcss
• Language: JavaScript
• Homepage:
• Size: 969 KB
• Stars: 1
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# ⚠️ This package has not been updated and is deprecated ⚠️

An official svelte package has been created.

Please use [@tabler/icons-svelte](https://www.npmjs.com/package/@tabler/icons-svelte).

---

This library is a fork project of [tabler-icons-svelte](https://github.com/benflap/tabler-icons-svelte)

This library provides components that export class attributes for TailwindCSS users.

# tabler-icons-svelte-with-tailwindcss

A library of Svelte components for [Tabler Icons](https://github.com/tabler/tabler-icons).

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

## Installation

```sh

# npm

npm install -D tabler-icons-svelte-with-tailwindcss

```

`tabler-icons-svelte-with-tailwindcss` needs to be added as a dev dependency as Svelte [requires original component source](https://github.com/sveltejs/sapper-template#using-external-components)

## Usage

Import components inside of the `` and use like any other Svelte component.

Find icons:

- Search on [tabler-icons.io](https://tabler-icons.io/)

- View [component names](ICON_INDEX_DOC.md)

### Import Components From Package

The easiest way to use the icon components is by importing them from the package.

```svelte

<script>

    import { CurrencyBitcoin, BrandGithub, CircleX } from "tabler-icons-svelte-with-tailwindcss";

```

## Props

The components each accept only 1 props:

| Prop  | Default                           |

| ----- | --------------------------------- |

| class | "h-6 w-6 stroke-current stroke-2" |

## License

[MIT](LICENSE)