Using MahApps.Metro.IconPacks In WPF Application

Good day!

Ever wonder how to style your WPF application controls or window with icons where you can choose from several hundreds of icons in a package? Well, nothing to worry about since there's an awesome Nuget Package that provides icons to suit your needs. It's called MahApps.Metro.IconPacks. The cool thing is, it's even grouped into several categories and that each category containes hundreds of icons. To use this awesome library of icons in your WPF project, install the Nuget Package specifically MahApps.Metro.IconPacks.

In your XAML view, reference the MahApps.Metro.IconPacks namespace first.

xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"

To use them like applying icons to your menu items, call the iconsPacks namespace and select PackIconMaterial. Then set the Kind property with the icon of your liking.

<iconPacks:PackIconMaterial VerticalAlignment="Center" HorizontalAlignment="Center" 
                                Kind="Plus" Height="10" Width="10"/>

Below is the complete code of MainWindow.xaml modified with the usage of PackIconMaterial icons.

<Window x:Class="WPFUsingMahAppsMetroIcons.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WPFUsingMahAppsMetroIcons"
        xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
        mc:Ignorable="d"
        x:Name="MainProjectWindow"
        WindowStartupLocation="CenterScreen"
        Title="Using MahApps.Metro.IconPack In WPF" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="25" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Menu Grid.Row="0">
            <MenuItem Header="_File" HorizontalAlignment="Left">
                <MenuItem Header="_New">
                    <MenuItem.Icon>
                        <iconPacks:PackIconMaterial VerticalAlignment="Center" HorizontalAlignment="Center" 
                                Kind="Plus" Height="10" Width="10"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="_Open">
                    <MenuItem.Icon>
                        <iconPacks:PackIconMaterial VerticalAlignment="Center" HorizontalAlignment="Center" 
                                                    Kind="FolderOpen" Height="10" Width="10"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="_Save">
                    <MenuItem.Icon>
                        <iconPacks:PackIconMaterial VerticalAlignment="Center" HorizontalAlignment="Center" 
                                                    Kind="Floppy" Height="10" Width="10"/>
                    </MenuItem.Icon>
                </MenuItem>
                <Separator/>
                <MenuItem Header="E_xit">
                    <MenuItem.Icon>
                        <iconPacks:PackIconMaterial VerticalAlignment="Center" HorizontalAlignment="Center" 
                                                    Kind="Close" Height="9" Width="9"/>           
                    </MenuItem.Icon>
                </MenuItem>
            </MenuItem>
        </Menu>
    </Grid>
</Window>

If referenced correctly, you should be able to see these icons attached to controls that uses them.

Source Code: Using MahApps.Metro.IconPacks In WPF Application

Cheers!