Search code examples
xamlfontswinui-3

WINUI 3 apply font to all controls


I want to change font in my WinUI 3 application. Just everywhere. I found a few answers here on SO, but they all seem to apply font to target like TextBlock, Button etc. The app I'm about to style has many different controls.

In CSS I'd simply do something like

* {
  font-family: Verdana;
}

Is there a way to achieve something like that in WinUI 3? Specify the default font name on one place, without naming all possible controls used in the app?


Edit: after trying the @Andrew KeepCoding approach, it works but not for all controls:

screenshot of the app with some controls not styled


Solution

  • Overriding the ContentControlThemeFontFamily should work, though, there are cases, like TextBlock, that you need to set the FontFamily explicitly.

    <Application
        x:Class="App16.App"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:App16">
        <Application.Resources>
            <ResourceDictionary>
                <ResourceDictionary.MergedDictionaries>
                    <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
                    <!-- Other merged dictionaries here -->
                </ResourceDictionary.MergedDictionaries>
                <!-- Other app resources here -->
                <FontFamily x:Key="ContentControlThemeFontFamily">Courier New</FontFamily>
                <Style
                    x:Key="TitleTextBlockStyle"
                    BasedOn="{StaticResource TitleTextBlockStyle}"
                    TargetType="TextBlock">
                    <Setter Property="FontFamily" Value="{StaticResource ContentControlThemeFontFamily}" />
                </Style>
                <Style TargetType="TextBlock">
                    <Setter Property="FontFamily" Value="{StaticResource ContentControlThemeFontFamily}" />
                </Style>
            </ResourceDictionary>
        </Application.Resources>
    </Application>
    

    Regarding to the custom font you mentioned in the comments, this answer might help.