craft-svelte-icons

A collection of SVG icons as Svelte components, optimized for easy and efficient usage in your Svelte projects.

Installation

To install the craft-svelte-icons package, use pnpm or your local package manager's install method:

pnpm i -D @getprovi/craft-svelte-icons

Usage

There are two ways to use the icons in your project:

1. Importing individual icons

You can import individual icons from the package and use them in your components. This will help you reduce the bundle size by only including the icons you need.:

<script>
	import ArrowDown from '@getprovi/craft-svelte-icons/ArrowDown';
	import { Icon } from '@getprovi/craft-svelte';
</script>

<Icon iconName={ArrowDown} />

2. Importing multiple icons

You can also import all icons from the package and use them in your components. If tree-shaking is not setup properly, this could include all icons in your bundle, so it's recommended to use the individual method if you experience performance issues:

<script>
	import { ArrowDown, MartiniSolid, DeliveryTruckSolid } from '@getprovi/craft-svelte-icons';
	import { Icon } from '@getprovi/craft-svelte';
</script>

<Icon iconName={ArrowDown} />
<Icon iconName={MartiniSolid} />
<Icon iconName={DeliveryTruckSolid} />

Available Icons

See the icon list for a full list of available icons.