How To Add Custom Color To The Title Bar In Universal Windows Apps

In this blog, you will learn how to add custom color to the title bar in Universal Windows apps.

Prerequisites

• Visual Studio 2015

Now, let's get started with the following steps.

Step 1 - Create Windows Universal Project

Open Visual Studio 2015 and go to File -> New -> Project, in order to create a new Universal App.



Step 2 - Giving the Project Name

Then, the "New Project" window will open. There, select Installed -> Template -> Visual C# -> Windows -> Universal and select a Blank App (Universal Windows).

Type the project name as TitleBarColor and click OK.



Step 3 - Setting the platform Versions

Here, choose the Target Version and Minimum Version for our Universal Windows application, and click OK button.



Step 4 - Choose Designer Window

Now, we go to the Solution Explorer and select MainPage.xaml.



Step 5 - Add the Coding

First, we Include the following namespaces.

using Windows.UI.ViewManagement;
using Windows.UI;

Next, we need to add the following code for dark blue Title Bar color in MainPage.xaml.

public MainPage()
{
    this.InitializeComponent();
    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;
}

Step 6 - Run the Application

Now, we are ready to run our project. So, click the Local Machine for running the application, as shown in the image below.



Output



Use the following code for greenyellow Title Bar in MainPage.xaml.

public MainPage()
{
    this.InitializeComponent();
    var titleBar = ApplicationView.GetForCurrentView().TitleBar;
    // Title Bar Content Area
    titleBar.BackgroundColor = Colors.GreenYellow;
    titleBar.ForegroundColor = Colors.White;
    // Title Bar Button Area
    titleBar.ButtonBackgroundColor = Colors.GreenYellow;
    titleBar.ButtonForegroundColor = Colors.White;
}

Output



Conclusion - I hope you understood how to add custom color to the title-bar in Universal Windows apps and run it.