Svelte Icons Pack

Based on https://github.com/react-icons/react-icons)

Demo page

https://leshak.github.io/svelte-icons-pack/#/

Installation

Yarn

yarn add svelte-icons-pack

NPM

npm install svelte-icons-pack --save

Usage

<script>
  import Icon from 'svelte-icons-pack/Icon.svelte';
  import AiOutlineNodeExpand from 'svelte-icons-pack/ai/AiOutlineNodeExpand';
</script>

<Icon src={AiOutlineNodeExpand} />

Icons

| Icon Library | License | Version | | ------------------------------------------------------------------ | ------------------------------------------ | ------- | Ant Design Icons|MIT|4.2.1 Bootstrap Icons|MIT|1.8.3 BoxIcons|CC BY 4.0 License|2.1.2 Feather|MIT|4.21.0 Font Awesome|CC BY 4.0 License|5.15.4 Heroicons|MIT|1.0.6 IcoMoon Free|CC BY 4.0 License|1.0.0 Ionicons|MIT|5.2.3 Remix Icon|Apache License Version 2.0|2.5.0 Simple Icons|CC0 1.0 Universal|7.4.0 Typicons|CC BY-SA 3.0|2.1.2 VS Code Icons|CC BY 4.0|0.0.12 Weather Icons|SIL OFL 1.1|2.0.12 css.gg|MIT|2.0.0

You can add more icons by submitting pull requests or creating issues.

Configuration

You can configure icons props using

<script>
  import Icon from 'svelte-icons-pack/Icon.svelte';
  import AiOutlineNodeExpand from 'svelte-icons-pack/ai/AiOutlineNodeExpand';
</script>

<style>
  :global(.custom-icon) {
    margin: 100px;
  }
</style>

<Icon src={AiOutlineNodeExpand} color="red" size="64" className="custom-icon" title="Custom icon params" />

| Key | Default | Notes | | ----------- | --------------------- | ---------------------------------- | | src | SvgIcon | | | color | undefined (inherit) | | | size | 1em | | | className | undefined | | | title | undefined | Icon description for accessibility |

Licence

MIT

• Icons are taken from the other projects so please check each project licences accordingly.