1
0
mirror of https://github.com/tabler/tabler-icons.git synced 2025-03-11 06:39:43 +01:00

Svelte Components pointing to @tabler/icons-svelte (#490)

This commit is contained in:
MrAmericanMike 2023-02-04 07:14:48 -03:00 committed by GitHub
parent 03c14d137e
commit b647f11a6d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -179,6 +179,22 @@ After importing the _IconsModule_ in your feature or shared module, use the icon
For more usage documentation refer to [the official documentation](https://github.com/pierreavn/angular-tabler-icons).
### Svelte
Svelte components available through [`@tabler/icons-svelte`](https://github.com/tabler/tabler-icons/tree/master/packages/icons-svelte) package.
```js
<script lang="ts">
import { IconHeart } from '@tabler/icons-svelte';
</script>
<main>
<IconHeart size={48} stroke={1} />
<IconHeart size="32" stroke="1.5" />
<IconHeart color="crimson" class="p-1" size="96" stroke="2" />
</main>
```
## CDN
All files included in `@tabler/icons` npm package are available over a CDN.
@ -285,20 +301,6 @@ Complex solution:
}
```
### Svelte
You can use [`tabler-icons-svelte`](https://github.com/benflap/tabler-icons-svelte) to use icons in your Svelte projects (see [example](https://svelte.dev/repl/e80dc63d7019431692b10a77525e7f99?version=3.31.0)):
```js
<script>
import { CurrencyBitcoin, BrandGithub, CircleX } from "tabler-icons-svelte";
</script>
<CurrencyBitcoin />
<BrandGithub size="48" strokeWidth="1" />
<CircleX />
```
### Jetpack Compose
For Android or Desktop you can use [`compose-icons`](https://github.com/DevSrSouza/compose-icons) to use icons in your projects. (see [docs](https://github.com/DevSrSouza/compose-icons/blob/master/tabler-icons/DOCUMENTATION.md))