Svelte

@dev.icons/svelte ships native Svelte components. SvelteKit, Vite, and Astro integrations all work without extra config.

Install

npm install @dev.icons/svelte

Usage

<script lang="ts">
  import { SvelteIcon } from "@dev.icons/svelte";
</script>

<SvelteIcon size={48} />

Monochrome variants

Import from the /mono subpath:

<script lang="ts">
  import { SvelteIcon } from "@dev.icons/svelte/mono";
</script>

<SvelteIcon size={48} />

Monochrome icons use currentColor, so they inherit the parent’s text color.

Props

Prop	Type	Default	Description
size	number | string	24	Width and height shortcut
title	string	undefined	Accessible label
color	string	currentColor	Fill override

SvelteKit

No special config needed. Import inside any +page.svelte, +layout.svelte, or component file.

<script lang="ts">
  import { GithubIcon } from "@dev.icons/svelte/mono";
</script>

<a href="https://github.com" aria-label="GitHub">
  <GithubIcon size={24} />
</a>