Home

Awesome

<a href="https://beyonk.com"> <br /> <br /> <img src="https://user-images.githubusercontent.com/218949/144224348-1b3a20d5-d68e-4a7a-b6ac-6946f19f4a86.png" width="198" /> <br /> <br /> </a>

Svelte Simple Icons

js-standard-style svelte-v3

Based on Svelte Eva Icons

Install

yarn add --dev svelte-simple-icons

or use NPM

npm install --save-dev svelte-simple-icons

Usage

Unused icons will get removed with tree shaking in bundlers like webpack and rollup.

    <script>
        // Only import what you need!
    	import { RIcon, HuluIcon, ... } from 'svelte-simple-icons'
    </script>
    
    <!-- When using custom elements -->
    <hulu-icon />
    
    <!-- When using regular svelte compontent -->
    <HuluIcon />

Use the svg name when importing, and convert it to {PascalCase}Icon. For instance, .NET on the creators site has an SVG name of dot-net.svg, so should be imported as <DotNetIcon /> See all icons here: https://simpleicons.org/

Exceptions

The one notable exception to the rule above is the 500px icon:

    <script>
    	import { FiveHundredPxIcon } from 'svelte-simple-icons'
    </script>
    
    <FiveHundredPxIcon />

Styling

You can add CSS classes icons by passing a styleClass attribute:

    <HuluIcon styleClass="some-class other-class" />