Optris-maintained fork. The original Projektanker.Icons.Avalonia is unmaintained — Projektanker GmbH has been dissolved and PRs to the upstream repo will not be reviewed. Optris GmbH has adopted this project to keep it alive for the Avalonia community, starting with an Avalonia 12 port.
Published to NuGet as
Optris.Icons.Avalonia,Optris.Icons.Avalonia.FontAwesome, andOptris.Icons.Avalonia.MaterialDesign. The C# namespace has been renamed fromProjektanker.Icons.AvaloniatoOptris.Icons.Avalonia(theProjektankername was misleading post-dissolution). The XAML XML namespace URLhttps://github.com/projektanker/icons.avaloniais preserved as an opaque identifier so existing consumer XAML keeps working without changes.
A library to easily display icons in an Avalonia App.
Live Demo — try it in your browser
dotnet add package Optris.Icons.Avalonia
dotnet add package Optris.Icons.Avalonia.FontAwesome
dotnet add package Optris.Icons.Avalonia.FontAwesome7
dotnet add package Optris.Icons.Avalonia.MaterialDesignInstall the core package and at least one icon provider. You only need the packs you plan to use. Font Awesome 6 and 7 can be used side-by-side.
| Name | Prefix | Example |
|---|---|---|
| FontAwesome 6 | fa |
fa-github |
| FontAwesome 7 | fa7 |
fa7-github |
| MaterialDesign | mdi |
mdi-github |
A full example is available in the Demo project (live). For a detailed walkthrough, see the Getting Started guide.
Register the icon provider(s) with the IconProvider.Current.
using Avalonia;
using Optris.Icons.Avalonia;
using Optris.Icons.Avalonia.FontAwesome;
using Optris.Icons.Avalonia.FontAwesome7;
using Optris.Icons.Avalonia.MaterialDesign;
namespace Demo.Desktop;
internal static class Program
{
public static void Main(string[] args)
{
BuildAvaloniaApp()
.StartWithClassicDesktopLifetime(args);
}
public static AppBuilder BuildAvaloniaApp()
{
IconProvider.Current
.Register<FontAwesomeIconProvider>()
.Register<FontAwesome7IconProvider>()
.Register<MaterialDesignIconProvider>();
return AppBuilder.Configure<App>()
.UsePlatformDetect()
.LogToTrace();
}
}Add xmlns:i="https://github.com/projektanker/icons.avalonia" to your view.
Standalone
<i:Icon Value="fa-solid fa-anchor" />Attached to ContentControl (e.g. Button)
<Button i:Attached.Icon="fa-solid fa-anchor" />Attached to MenuItem
<MenuItem Header="About" i:MenuItem.Icon="fa-solid fa-circle-info" />Custom icon size
<i:Icon Value="fa-solid fa-anchor" FontSize="24" />Animated
<i:Icon Value="fa-spinner" Animation="Pulse" />
<i:Icon Value="fa-sync" Animation="Spin" />As an Image source
<Image>
<Image.Source>
<i:IconImage Value="fa-solid fa-anchor" Brush="(defaults to black)" />
</Image.Source>
</Image>Just implement the IIconProvider interface:
namespace Optris.Icons.Avalonia;
public interface IIconReader
{
IconModel GetIcon(string value);
}
public interface IIconProvider : IIconReader
{
string Prefix { get; }
}and register it with the IIconProviderContainer:
IconProvider.Current.Register<MyCustomIconProvider>()or
IIconProvider provider = new MyCustomIconProvider(/* custom ctor arguments */);
IconProvider.Current.Register(provider);The IIconProvider.Prefix property has to be unique within all registered providers. It is used to select the right provider. E.g. FontAwesomeIconProvider's prefix is fa.
For a complete guide, see Custom Providers.
Browse the full documentation on the Wiki, or jump to a specific page:
- Getting Started — installation, setup, first icon
- Usage Guide — controls, attached properties, animations, styling, data binding
- Icon Packs — Font Awesome & Material Design reference, browse icons
- Custom Providers — implement your own icon source
- API Reference — classes, interfaces, and model types
- Troubleshooting — common errors and fixes
See CONTRIBUTING.md for development setup, building, testing, and release process.