Blazor.Heroicons 3.2.1.1

dotnet add package Blazor.Heroicons --version 3.2.1.1
                    
NuGet\Install-Package Blazor.Heroicons -Version 3.2.1.1
                    
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="Blazor.Heroicons" Version="3.2.1.1" />
                    
For projects that support PackageReference, copy this XML node into the project file to reference the package.
<PackageVersion Include="Blazor.Heroicons" Version="3.2.1.1" />
                    
Directory.Packages.props
<PackageReference Include="Blazor.Heroicons" />
                    
Project file
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package.
paket add Blazor.Heroicons --version 3.2.1.1
                    
#r "nuget: Blazor.Heroicons, 3.2.1.1"
                    
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
#:package Blazor.Heroicons@3.2.1.1
                    
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package.
#addin nuget:?package=Blazor.Heroicons&version=3.2.1.1
                    
Install as a Cake Addin
#tool nuget:?package=Blazor.Heroicons&version=3.2.1.1
                    
Install as a Cake Tool

Blazor.Heroicons

Blazor.Heroicons

A third-party Blazor component library for Heroicons — beautiful hand-crafted SVG icons by the makers of Tailwind CSS.

NuGet package Heroicons version License Build and test

Live Demo — Browse and preview all available icons

📦 Installation

dotnet add package Blazor.Heroicons

Supports .NET 8.0, .NET 9.0, and .NET 10.0.

🎨 Icon Styles

Each icon is available in four styles:

Style Namespace Size Best for
Outline Blazor.Heroicons.Outline 24x24, 1.5px stroke Primary navigation and marketing sections
Solid Blazor.Heroicons.Solid 24x24, filled Primary navigation and marketing sections
Mini Blazor.Heroicons.Mini 20x20, filled Smaller elements like buttons and form inputs
Micro Blazor.Heroicons.Micro 16x16, filled Tight, high-density UIs

Browse the full list of icons on the demo site →

🚀 Usage

Individual icon components

Each icon is available as a standalone Blazor component. Import the namespace for the style you want and use the icon directly:

@using Blazor.Heroicons.Outline

<BeakerIcon class="size-6 text-blue-500" />

All standard HTML attributes (class, id, style, etc.) are passed through to the underlying SVG element. Icons use currentColor for fill/stroke, so they can be styled with CSS or utility classes like Tailwind CSS.

Dynamic icon by name (<Heroicon />)

Reference any icon by name and style using the Heroicon component:

@using Blazor.Heroicons

<Heroicon Name="@HeroiconName.Sparkles" Type="HeroiconType.Outline" class="size-6 text-yellow-600" />
Parameter Type Default Description
Name string HeroiconName.Sparkles Icon name — supports multiple formats (see below)
Type HeroiconType HeroiconType.Outline Icon style to render

The Name parameter is flexible and accepts several formats:

  • "HandThumbUp" or "HandThumbUpIcon"
  • "hand-thumb-up" (hyphenated)
  • "handthumbup" (case-insensitive)

Use the HeroiconName static class for IntelliSense support (e.g. HeroiconName.AcademicCap).

Random icon (<RandomHeroicon />)

Render a random icon from a given style:

@using Blazor.Heroicons

<RandomHeroicon Type="HeroiconType.Mini" class="size-6 text-green-700" />
Parameter Type Default Description
Type HeroiconType HeroiconType.Outline Icon style to choose from

📄 License

This library is MIT licensed.

Product Compatible and additional computed target framework versions.
.NET net8.0 is compatible.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed.  net9.0 is compatible.  net9.0-android was computed.  net9.0-browser was computed.  net9.0-ios was computed.  net9.0-maccatalyst was computed.  net9.0-macos was computed.  net9.0-tvos was computed.  net9.0-windows was computed.  net10.0 is compatible.  net10.0-android was computed.  net10.0-browser was computed.  net10.0-ios was computed.  net10.0-maccatalyst was computed.  net10.0-macos was computed.  net10.0-tvos was computed.  net10.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages (1)

Showing the top 1 NuGet packages that depend on Blazor.Heroicons:

Package Downloads
GANBlazor.UI

Modern, minimal Blazor UI component library with 20+ components (Button, Form, Card, Alert, Badge, Modal, Switch, Spinner, Tabs, Toast, Tooltip, Avatar) inspired by shadcn/ui. Requires Tailwind CSS in the consuming app.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last Updated
3.2.1.1 1,724 3/1/2026
3.2.1 114 3/1/2026
3.2.0 113 3/1/2026
3.1.0 117 2/28/2026
3.0.0 221 2/28/2026
2.2.0 16,693 11/18/2024
2.1.5 3,754 7/10/2024
2.1.2.3 894 6/18/2024
2.1.2.2 3,582 3/23/2024
2.1.2.1 246 3/22/2024
2.1.2 2,401 12/19/2023
2.1.1 323 12/18/2023
2.0.1 978 11/23/2023
1.2.3 5,129 5/10/2023
1.2.2 318 5/7/2023
1.2.1 1,776 11/2/2022
1.2.0 535 10/31/2022
1.1.2 572 10/11/2022
Loading failed