.NET MAUI: Use Font Awesome Icons in your project

Maybe you want to use some icons in your project like so:

To do that, you need to do the following steps:

1) Select the Font Awesome icon set you wish to use and download the OTF https://fontawesome.com/download

2) Add the font file to your projects /Resources/Fonts folder

3) Add the font info to your MauiProgram.cs:

fonts.AddFont("Font Awesome 6 Free-Solid-900.otf", "FASolid");

Set the Build Action to „MauiFont“ (right click on the font file -> Build Action)

4) Add a new file „Icons.xaml“ to your projects /Resources/Styles folder, with this content:

<?xml version="1.0" encoding="UTF-8" ?>
<?xaml-comp compile="true" ?>
<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">

        <x:String x:Key="user">&#xf007;</x:String>

</ResourceDictionary>

5) For each icon you want to use, you add one line in this style:

<x:String x:Key="user">&#xf007;</x:String>

Where the „Key“ is the keyword, which you will user later in your xaml view file. Instead of „f007“ you enter the respective unicode identifier, which can be found on the Font Awesome page for every icon.

6) Reference your icon lib in App.xaml:

 <ResourceDictionary>
     <ResourceDictionary.MergedDictionaries>
         ...
         <ResourceDictionary Source="Resources/Styles/Icons.xaml" />
     </ResourceDictionary.MergedDictionaries>
 </ResourceDictionary>

7) Now you can use the icons in xaml view file:

<HorizontalStackLayout HorizontalOptions="Center">
    <Image>
        <Image.Source>
            <FontImageSource
                FontFamily="FASolid"
                Glyph="{StaticResource user}"
                Color="DodgerBlue"
                Size="24"/>
        </Image.Source>
    </Image>
    <Label TextColor="DodgerBlue"
            FontSize="Medium"
            Margin="10">
        Suzie Sample
    </Label>
</HorizontalStackLayout>