Colors, Styles and Templates in UWP, Windows UI (WinUI) and the Windows App Sdk (WinAppSdk)

This is a quick post just to provide a reference point for anyone who’s looking for the default styles, templates, colors etc for Windows UI. Let’s break this down a bit:

UWP

Let’s start with the current technology, UWP. If you want to inspect the default styles and templates for UWP controls, you just need to search for “UWP generic.xaml” and you’ll end up at this page XAML theme resources – UWP applications | Microsoft Docs which states:

Each theme resource is part of the XAML file themeresources.xaml. For design purposes, themeresources.xaml is available in the \(Program Files)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\<SDK version>\Generic folder from a Windows Software Development Kit (SDK) installation. The resource dictionaries in themeresources.xaml are also reproduced in generic.xaml in the same directory.

For example, on my computer this equates to

C:\Program Files (x86)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\10.0.19041.0\Generic

In this folder you’ll find generic.xaml and themeresources.xaml which between them will include all the default colours, styles, templates etc for UWP controls.

WinUI 2.x

The styles for WinUI are, as you’d imagine, located in the GitHub repository at https://github.com/microsoft/microsoft-ui-xaml. More specifically, there are a couple of folders where you’ll want to look:

• CommonStyles
• Materials

These folders contain the various themeresource.xaml files that define the styles, templates etc for the WinUI2.x controls.

WinUI 3.0

At the time of posting, the WinUI3 source code hasn’t been made open source, so you can’t just go look up the various Xaml files. However, luckily the NuGet package ships with a generic.xaml file which contains all the colours, styles and templates you’re going to be interested in.

For me the folder that contains the generic.xaml is

C:\Users\NickRandolph\.nuget\packages\microsoft.winui\3.0.0-preview4.210210.4\lib\net5.0-windows10.0.18362.0\Microsoft.WinUI\Themes

Update: The release of the Windows App Sdk incorporated WinUI 3.0 and as such the location of the generic.xaml file is now located under the Windows App Sdk package

C:\Users\NickRandolph.nuget\packages\microsoft.windowsappsdk\1.1.3\lib\net5.0-windows10.0.18362.0\Microsoft.WinUI\Themes\generic.xaml