My Windows Hub

How To Get Colored Title Bars In Firefox In Windows 10?

Mozilla Firefox has added a new method for introducing colored title bars in Windows 10. Previously there was no such colored title bar for Firefox in Windows 10. Many developers tweaked the settings and modified the apps themes to get colored title bars. Till then the feature was not added natively. But Mozilla decided to drive away the feature. Developers developed a hack for the shortcoming by modifying the userChrome.css file. Unfortunately, Firefox 40 later on removed this file and the hack became obsolete. However the hack works for Firefox 40 and less. The following tutorial will help you create colored title bars in Firefox, regardless which version of the browser you’re running.

For Firefox 39 And Below

1. For Firefox versions older than 40, users can use the old hack very conveniently. In this case, you have to modify the userChrome.css file in order to get colored title bars in Firefox.

2. Open Firefox and type about:support.

3. Next, scroll down to the profile row. Click on ‘Show Folder’. Now look for a folder called ‘Chrome’. Inside this folder, there is a file called userChrome.css. Open it in Notepad.

Add the following code to the end of the file and save it.

@-moz-document url(chrome://browser/content/browser.xul) {
@media (-moz-os-version: windows-win10) {
#main-window:not([customizing]){
-moz-appearance: -moz-win-glass !important;
background-color: transparent !important;
}
}
}

4. now, restart the browser and you will have colored title bars in Firefox.

For Firefox 40 And Above

1. The userChrome.css file is no more there in Firefox 40 and above.

2. So here, you have to modify the browser’s UI.

3. Install the Classic Theme Restorer add-on.

4. Now, go to the add-on’s options and select the ‘Custom css code’ tab from the left. Paste the following code in it and you will have colored title bars in Firefox.

@-moz-document url(chrome://browser/content/browser.xul) {
@media (-moz-os-version: windows-win10) {
#main-window:not([customizing]){
-moz-appearance: -moz-win-glass !important;
background-color: transparent !important;
}
}
}

That’s all!

There is one disadvantage with this hack. This process doesn’t work for Firefox 57. The company has ameliorated the add-ons and hence this issue.

About 

Nick is a Software Engineer. He has interest in gadgets and technical stuffs. If you are facing any problem with your Windows, feel free to ask him.

 
Comments