WPF Themes - Use System Colors and Switch Between Light and Dark App Modes Like Office 2021 (v21.2)

In the latest version of Microsoft Office products, users can select a theme based on system settings. When this theme is used, Office takes Windows Accent Color and App Mode (Light/Dark) settings and applies them to Office itself. If a user changes the Accent Color or App Mode in the OS, Office detects this change and updates the appearance of the application automatically.

With DevExpress WPF Controls v21.2, you can obtain appropriate Windows Accent Color and App Mode (Dark/Light) settings and apply these colors to your application (using our new System Colors theme). If you prefer a Dark application theme, you can use our new Win10Dark theme instead (like any other DevExpress WPF application theme).

System Colors Theme

Just like Microsoft Office, our System Colors theme obtains Windows Accent Color and App Mode (Dark/Light) settings and applies these colors to your application. Our System Colors theme uses palettes to switch colors at run time.

You can find our System Colors theme in the following theme selectors:

• BarSubItemThemeSelectorBehavior
• BarSplitItemThemeSelectorBehavior
• RibbonGalleryItemThemeSelectorBehavior
• GalleryThemeSelectorBehavior
• HamburgerSubMenuThemeSelectorBehavior

Set the theme selector’s behavior inherited ShowWin10SystemColorTheme property to true to display the theme in the selector.

To apply the Window's Accent Color and App Mode to your application in code-behind, create a Win10Palette instance and pass true to the listenAppModeChanges constructor parameter. Then, generate a new theme based on the Win10Palette and apply this theme to your application.

var palette = new Win10Palette(true);
var theme = Theme.CreateTheme(palette);
Theme.RegisterTheme(theme);
ApplicationThemeHelper.ApplicationThemeName = theme.Name;

You should also reference the Mono.Cecil NuGet package and the DevExpress.Xpf.Core assembly to apply the System Colors theme to your application (either in code behind and from a theme selector).

Windows 10 Dark Theme

As mentioned above, you can also activate the Dark App Mode for your application (based on system settings). To enable this option, we created a new Win10Dark application theme. If you prefer to use the Dark version regardless of user settings, select the Win10Dark theme like any other DevExpress WPF application theme.

For more information on how to apply a theme to your application, please refer to our Themes help topic.

Your Feedback Matters

As always, we welcome your thoughts. Do you expect to use our new Dark theme? Do you allow end-users to modify theme selection within your application?

Free DevExpress Products - Get Your Copy Today