Introduction

This sample shows how much of the WPF controls can be changed by simply fiddling with the SystemColors resource keys.

Building the Sample

Just download, unzip, open and run!

Description

WPF comes with a very nicely buffed set of controls. If you want to completely change the colours, you can simply use another Theme. However, sometimes you just want to change one control, change the selected colour, or change a colour that is not simply referenced by a regular property like Background.

All WPF controls use ControlTemplates, and in those templates they refer to a number of sources for colours. One of those sources is the SystemColors namespace.

WPF references the colours in this namespace by Keys (just like normal resources) which also means when you change SystemColors (through Control Panel) the colours in your application will change too.

This also means we can override these colours, and change the look of unreachable componants, without having to change the ControlTemplate. Changing SystemColors can of course affect other controls, so if you only want the change to be on one control, you must declare the resources closer to where they are to be used, so nothing else is affected.

Below is an example of one of the sections, showing a RadioButton. All the colours that can be changed have been, leaving only the BulletChrome showing.

XAML

Edit|Remove

	        <GroupBox Header="RadioButton">
	            <GroupBox.Resources>
	                <SolidColorBrush x:Key="{x:Static SystemColors.ControlTextBrushKey}" Color="Red" /> <!-- or Foreground property -->
	                <SolidColorBrush x:Key="{x:Static SystemColors.GrayTextBrushKey}" Color="LightBlue" /> <!-- Disabled color -->
	            	<!-- Uses Microsoft_Windows_Themes:BulletChrome -->
				</GroupBox.Resources>
	            <RadioButton Content="RadioButton" Margin="10" Style="{DynamicResource RadioButtonStyle1}" Background="LightGreen" BorderBrush="LightGreen"/>
	        </GroupBox>

            <GroupBox Header="RadioButton"> 
                <GroupBox.Resources> 
                    <SolidColorBrush x:Key="{x:Static SystemColors.ControlTextBrushKey}" Color="Red" /> <!-- or Foreground property --> 
                    <SolidColorBrush x:Key="{x:Static SystemColors.GrayTextBrushKey}" Color="LightBlue" /> <!-- Disabled color --> 
                    <!-- Uses Microsoft_Windows_Themes:BulletChrome --> 
                </GroupBox.Resources> 
                <RadioButton Content="RadioButton" Margin="10" Style="{DynamicResource RadioButtonStyle1}" Background="LightGreen" BorderBrush="LightGreen"/> 
            </GroupBox>

This sample project also includes ALL the default templates for ALL these controls, as generated out of Expression Blend

Just so I could check for other SystemColors being used, I copied all of the default templates into the project. There are a few others used, but are not sigmnificant in this study. If you find a part of a control you cannot change with resource overrrides, you will have to edit the ControlTemplate. Please see the App.xaml file for all the ControlTemplates.

Source Code Files

MainWindow.xaml.cs - all the controls and resource overrides
App.xaml - All the control templates