Svelte has the smallest selection of first-party packages, which makes coverage and export flexibility more important than usual.
| Library | Icons | Variants | Grid | License | Package |
|---|---|---|---|---|---|
| Lucide Icons | 1,979 | outline only | 24×24 | ISC | lucide-react |
| Heroicons | 1,297 | outline and solid | 16/20/24 | MIT | @heroicons/react |
| Phosphor Icons | 9,198 | thin, light, regular, bold, fill and duotone | 24×24 | MIT | phosphor-react |
| Tabler Icons | 6,324 | outline only | 24×24 | MIT | @tabler/icons-react |
Because Svelte compiles away, importing raw SVG paths is nearly free. When a set has no Svelte package, pasting an inline SVG from IconStash is often cleaner than adding a dependency.
For most Svelte projects, start with
Lucide Icons — 1,979 icons,
outline only, ISC licensed, installed as
lucide-react. Move to
Heroicons if you need
outline and solid instead.
Lucide Icons is the safest default: 1,979 icons, ISC licensed, and a first-party package. Because Svelte compiles away, importing raw SVG paths is nearly free. When a set has no Svelte package, pasting an inline SVG from IconStash is often cleaner than adding a dependency.
Only if you import the whole set. Every library here tree-shakes, so bundling ten named icon exports ships ten icons. Watch for barrel imports like import * as Icons from "...", which defeat that.
Yes, and for small numbers of icons it is often better — no dependency, no version drift, and full control over attributes. Export any icon from IconStash as an inline SVG or a downloadable file and paste it straight in.