metonym
svelte-codicons
VS Code Codicons as Svelte components.
This zero-dependency library uses svelvg to convert SVG files from the @vscode/codicons into Svelte components.
Try it in the Svelte REPL.
Installation
# NPM
npm i -D svelte-codicons
# pnpm
pnpm i -D svelte-codicons
# Bun
bun add -D svelte-codicons
# Yarn
yarn add -D svelte-codiconsUsage
Basic
<script>
import { Add, Calendar, Edit } from "svelte-codicons";
</script>
<Add />
<Calendar />
<Edit />Refer to ICON_INDEX.md for a list of supported icons.
Direct import
Use the direct import for faster compiling during development.
`svelte no-eval
## Using `svelte:component`
```svelte
<script>
import * as icons from "svelte-codicons";
</script>
{#each Object.entries(icons) as [icon, component]}
<div>
<svelte:component this={component} />
{icon}
</div>
{/each}Custom size
$$restProps are forwarded to the svg element.
Use the width and height attributes to customize the icon size. The default is 16px.
<Add width={36} height={36} />Custom color
Use the fill attribute to specify a custom color.
<Add fill="red" />License
vscode-codicons is licensed as CC-BY-4.0.