Mirality.Blazor.Icons.Fluent 1.0.0

.NET 6.0
dotnet add package Mirality.Blazor.Icons.Fluent --version 1.0.0
NuGet\Install-Package Mirality.Blazor.Icons.Fluent -Version 1.0.0
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="Mirality.Blazor.Icons.Fluent" Version="1.0.0" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add Mirality.Blazor.Icons.Fluent --version 1.0.0
#r "nuget: Mirality.Blazor.Icons.Fluent, 1.0.0"
#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.
// Install Mirality.Blazor.Icons.Fluent as a Cake Addin
#addin nuget:?package=Mirality.Blazor.Icons.Fluent&version=1.0.0

// Install Mirality.Blazor.Icons.Fluent as a Cake Tool
#tool nuget:?package=Mirality.Blazor.Icons.Fluent&version=1.0.0

.NET 6,7 NuGet version (Mirality.Blazor.Icons.Fluent)

This is a Blazor component wrapper library for all of the icons in the Fluent UI System icon set created by Microsoft and released under the MIT license.

Inline components allow you to more easily recolor or otherwise style the icons, as they obey a directly applied class or inherited CSS properties, unlike external SVG image files. (There is a way to trick SVG use into allowing external styling, but that has some different caveats, including current browsers lacking full support for unmodified external SVGs.)


  1. Simply import this Nuget package as usual. (Note: it is not recommended to use this as a project reference -- due to the large number of individual files it tends to bring IDEs to an absolute crawl, and it takes a surprisingly long time to compile all the components.)

  2. Optionally, add the following line to your _Imports.razor:

    @import Mirality.Blazor.Icons.Fluent


To display an icon, include its component (with optional class), e.g.:

<IconFluentGridDots28Regular class="text-info" />

You can also set other attributes of the resulting <svg/> element, such as its style or overriding its height.

All component names have been PascalCased from the snake-cased original icon names, and have the IconFluent prefix to allow importing multiple icon sets without collisions.

For more usage information, including customisation options, see the docs for the Mirality.Blazor.Icons base package.


The number in the icon name refers to the "native" size of the icon (and thus its internal viewBox); however by default all icons will render with a height of 1em -- i.e. matching your current font height. As such, to resize them you can just change the font size. Alternatively, you can override the height to some other explicit size.

If you want to render the icon at its native size then you will need to set the font size or height accordingly.

In addition to the main Microsoft Fluent UI site, you can view a gallery of the available icons at Iconify. This library was generated from the Iconify icon data. (Although it might become outdated at some point; submit an issue if it needs an update.)

Note that currently only the "primary" icons (non-deleted and non-aliases) have been imported.

Offline Usage

This library embeds all the icon data, so online access is not required to load any image, nor any external files -- just the library itself.

Product Versions
.NET net6.0 net6.0-android net6.0-ios net6.0-maccatalyst net6.0-macos net6.0-tvos net6.0-windows net7.0 net7.0-android net7.0-ios net7.0-maccatalyst net7.0-macos net7.0-tvos net7.0-windows
Compatible target framework(s)
Additional computed target framework(s)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last updated
1.0.0 172 1/17/2023