# ShellIcons

> Lucide-derived SVG icons for Blazor. Zero JS, zero CSS, tree-shakeable typed components.

Source: https://shellicons.shellui.dev/docs/introduction

**Lucide-derived SVG icons for Blazor.** Zero JS. Zero required CSS. Every icon is a typed component — tree-shakeable, IntelliSense-friendly, byte-identical to Lucide.

```razor
<Zap Size="32" />
```

## Why another icon library

The .NET icon story is fractured:

- **Blazor** — everyone hand-embeds SVG blocks. A couple of community Lucide ports on NuGet drift from upstream and none use a source generator.
- **Avalonia** — usually `Svg.Skia` for raw SVG (heavy) or hand-authored `Path` XAML.
- **MAUI** — no native SVG in XAML at all. Consumers ship `.svg` files as `MauiImage` (rasterized, loses color inheritance).

ShellIcons is the answer to all three from one Lucide-derived catalog:

- **Blazor today.** Full 1,555-icon catalog, auto-generated by a Roslyn source generator from a pinned Lucide tag.
- **MAUI in preview.** Same catalog as native `Path` shapes, converted at build time — no SVG parsing on the device. See [MAUI](https://shellicons.shellui.dev/docs/maui/getting-started.md).
- **Avalonia in preview.** The same conversion, drawn directly and colored like the surrounding text. See [Avalonia](https://shellicons.shellui.dev/docs/avalonia/getting-started.md).

## What you get

- **1,555 icons** — the entire Lucide 0.475.0 catalog. Bumping is one `git pull` + rebuild.
- **Typed components** — `<ChevronRightIcon />`, `<ZapIcon />`, `<TriangleAlertIcon />`. Safe next to any UI kit, and unused icons are trimmed.
- **Icons as values** — `@Icon.ChevronRight()` for component parameters and lists.
- **Dynamic dispatcher** — `<ShellIcon Name="chevron-right" />` for markdown, CMS-driven content, dynamic lookup.
- **Custom icons pack** — drop your own SVGs into `catalog/custom/icons/`, they compile in alongside Lucide.
- **`currentColor`-native** — coloring inherits from any CSS `color` on an ancestor. No `Color` prop.
- **Accessibility built-in** — set `Title` and get a proper `role="img"` + `<title>` element for screen readers.

## A minute of code

```razor
<PreviewRow FontSize="24px">
  <PreviewCell Color="crimson"><TriangleAlert /></PreviewCell>
  <PreviewCell Color="seagreen"><CircleCheck /></PreviewCell>
  <PreviewCell Color="royalblue"><Search /></PreviewCell>
  <PreviewCell Color="rebeccapurple"><Zap /></PreviewCell>
</PreviewRow>
```

## Ready?

- [Installation](https://shellicons.shellui.dev/docs/getting-started/installation.md) — one `dotnet add package`
- [Quick start](https://shellicons.shellui.dev/docs/getting-started/quick-start.md) — first icon in a Blazor page
- [Browse the catalog](https://shellicons.shellui.dev/docs/icons.md) — all 1,555 icons, searchable