> If you want to use more Icons Packs and components for multiple Frameworks (React, Vue, Lit and more), check out @steeze-ui/icons which is meant as a successor to svelte-hero-icons:

$3

- Icon Components for various frameworks (svelte, lit, solid and react)
- Icon Packs (e.g heroicons, radix-icons, feathericons and more)
- A template to create your own publishable Icon Pack
- Now lives under an org that will focus on more ui tools for svelte

---

Description

- complete heroicons set optimized for svelte
- programatically change solid or outline version based on the solid attribute (solid, mini, micro)
- fully typed for a great IDE experience
- works out of the box with SvelteKit
- SSR compatible (no JS is needed for the client to display the icon)

Installation

- install as devDependency

$3

``bash
npm i -D svelte-hero-icons
`

Configuration

SvelteKit

- svelte-hero-icons should work with SvelteKit without any configuration
- If you have any problems, this could help adding to your vite.config.js:

`js
ssr: {
noExternal: ["svelte-hero-icons"],
}
`

Usage

- Default is Outline version of icon
- Use solid attribute for Solid Icons

`html





















`

$3

`svelte



``

Author

This package is based on heroicons

See all available icons here: https://github.com/refactoringui/heroicons