How to add Colorful Title Bars for PWAs on Chromium Edge

Microsoft introduces Colorful Title Bars for PWAs on Chromium Edge Web Browser (Dev & Canary). Owing to this attribute, one can now customize the title bars of the progressive web apps installed with Edge. PWAs are web apps that we can operate directly from a web browser without downloading them separately. They use modern web technologies and can be launched on the Desktop similar to that of any regular apps. Though PWAs are hosted on the Internet, users can create a separate shortcut of them and use them just like Windows native applications. One can even download and install these apps from either Microsoft Store or Chromium-based web-browsers. 

Chromium-based Edge browsers sanction installing of such progressive web apps. After proper installation, you may run such an application on your web browser. In such scenarios, the address bar and other browser UI elements are hidden in this mode, so the app only has its own separate title bar.

In general, PWAs automatically receive a color based on the website default color scheme. However, with Edge Dev version 80.0.351.0, users can customize the color of the title bar of their own choice. Let’s explore ways to apply color to such apps on Edge Canary 80.0.351.0 or above.


How to apply color to the title of Progressive Web Apps

To add Colorful Title Bars for PWAs on Chromium Edge, use the steps –

  • Start Chromium Edge.
  • Next, type the URL of either Facebook or Twitter at its address bar and press Enter.
  • Now jointly press Alt and F keys thereafter navigate to Apps > Install this site as an app.

add Colorful Title Bars for PWAs on Chromium Edge

Note: You may change the name of the specific app as well. 

  • Rename the change (if you want) then hit Install.

Install app

That’s it, this will now run similar to that of Windows app with its own title bar as well as a taskbar icon. 

Latest Chromium Edge Versions

The Company hasn’t yet released the stable Chromium Edge versions. They will roll out the stable version by the mid of Jan’ 2020. Till then, you may enjoy its three-set of insiders – Beta, Dev, and Canary. Out of these Beta is the most stable one and is updated once in a week while Canary the most unstable one receives updates on a daily basis. Chromium Edge Dev lies in between these two and receives updates weekly. 

Here are the latest versions of Chromium Edge by Microsoft –