Svelte Heroicons
> 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
- 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