Skip to content

metonym/svelte-spectrum-icons

Repository files navigation

svelte-spectrum-icons

NPM Build

Adobe Spectrum Workflow and UI SVG icons as Svelte components.

This library builds Adobe Spectrum Workflow and UI icons as Svelte components with zero dependencies.

Spectrum icons have two sizes: 18 for desktop and 24 for mobile.

For Workflow icons, the sizes are appended to the icon name. For example, Add becomes Add18 and Add24.

For UI icons, the word "Mobile" is appended to the icon name; Asterisk is size 18 while AsteriskMobile is size 24.

Try it in the Svelte REPL.

Install

yarn add -D svelte-spectrum-icons
# OR
npm i -D svelte-spectrum-icons

Usage

<script>
  import Asterisk from "svelte-spectrum-icons/ui/Asterisk.svelte";
  import Add24 from "svelte-spectrum-icons/workflow/Add24.svelte";
</script>

<Asterisk />
<Add24 />

For a full list of supported icons:

API

$$restProps are forwarded to the svg element.

Forwarded events

  • on:click
  • on:mouseover
  • on:mouseenter
  • on:mouseout
  • on:keydown

License

MIT