Sverocons

A simple svelte wrapper for the Heroicons Library taking inspiration from the component approach to svg icons by Amelia Wattenberger.

Using an Icon

<Icon name="arrow" type="solid" direction="w" class="h-8 w-8" />

All icons can receive three different inputs:

  • name
    • required
    • heroicon name in snake case
  • type
    • one of: outline / solid
    • default: outline
  • direction
    • one of: nw, n, ne, e, se, s, sw, w

Only Name is required with type defaulting to outline and and direction to n. All directional icons have been removed IE arrow-right where they were identical. The styles default to h-6 w-6, but this can be overridden by adding in a class.

Top categories

svelte logo

Need a Svelte website built?

Hire a professional Svelte developer today.
Loading Svelte Themes