How to apply custom color to the Title Bar in Windows 10 Universal Apps ?

If you are developing a Windows 10 Universal Apps and want to play around with the Title Bar of your app, you can easily do that. There are set of APIs that can help you to deal with playing around Title Bar. Instead of having default color of title bar, you can apply your own colors. Not only with colors, you can even customize the overall appearance of the Title bar.

This is often useful when you want to match a color theme with your overall app along with the title bar. For an example, the “Calendar” app. The title bar appearance is different than the default title bar styles.

Must Read : How to display the back button in the Windows Universal APPs title bar ?

So here is how you can customize the title bar for your own applications. The ApplicationView class represents the active view of the application and all the associate states. ApplicationView.getForCurrentView() methods use to get the app view for the current app that returns an instance of ApplicationView . Now you can use all the associated properties for the current view, and TitleBar is one of them.

Include the following namespace

using Windows.UI.ViewManagement;

and here the snippet of the code to change the title bar color.

               var titleBar = ApplicationView.GetForCurrentView().TitleBar;

            // Title Bar Content Area
            titleBar.BackgroundColor = Colors.DarkBlue;
            titleBar.ForegroundColor = Colors.White;

            // Title Bar Button Area
            titleBar.ButtonBackgroundColor = Colors.DarkBlue;
            titleBar.ButtonForegroundColor = Colors.White;

This is how it will look like – A blue background title bar for your application.