Using FontAwesome in WPF

Want to use FontAwesome (http://fontawesome.io/) in your WPF application? With a few simple steps you can do it.

1) Use Nuget and Install-Package FontAwesome

2) Mark the file /fonts/fontawesome-webfont.ttf and set it’s “Build Action” to “Resource”

3) Test the font in a simple TextBlock like this:

<Window x:Class="FontAwesomeWPFBlogTest.MainWindow"         
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"         
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"         
    Title="MainWindow"         
    Height="350"         
Width="525">
    <Grid>
        <Viewbox>
            <TextBlock Text="&#xf09b;"
                        FontFamily="pack://application:,,,/fonts/#FontAwesome" />
        </Viewbox>
    </Grid>
</Window>

Run it and you should see this:

The “hardest” thing is to make sure you enter the right icon-hexcode for the Text property. You can look at the different icons available in the icon-gallery page on http://fontawesome.io/icons/ then check the name of the icon you like. After that, go to the /Contents/font-awesome.css file in your project and look it up there, say for example the paint-brush icon:

.fa-paint-brush:before {   content: "\f1fc";
}

The content-value says “\f1fc” which is the hex value of the paint-brush symbol in the font and that is the value you have to enter in the Text-property in your XAML:

Text=”&#f1fc;”