[Tip] Enable Dark Mode Everywhere in Mozilla Firefox
Mozilla Firefox web browser comes with built-in Dark theme mode which allows users to enjoy dark mode or night mode in Firefox without installing any extra extension. Many people prefer dark modes in apps as the dark UI or black UI reduces eye strain and allows people to use the apps for long time specially at night time.
Firefox users can enable Dark theme mode manually as well as automatically. We posted a tutorial last year to tell you how to activate and enable dark mode in Mozilla Firefox:
[Tip] How to Enable Built-in Dark Theme Mode in Mozilla Firefox
Advertisement
When you enable dark mode in Firefox, it converts the whole UI such as titlebar, toolbar, tab bar, menus, etc in dark colors. But a few pages such as Options, Add-ons Manager, About pages, error pages, etc are not switched to dark theme.
So dark mode is not applied everywhere in Firefox. This partial dark mode annoys users and doesn’t look good.
Fortunately Mozilla has provided a preference/flag to enable dark mode everywhere in Firefox. Newer versions of Firefox such as version 68 and later come with support for this preference and feature. We told you about this preference long time back in UPDATE 133 in our exclusive Firefox Nightly Updates topic when Firefox 68 was under development and testing.
The feature is not enabled by default and we need to manually activate and enable it. Once you set the hidden preference to true i.e, enable the preference, the whole UI of Firefox changes to dark theme as shown in following screenshots:
Firefox Options (about:preferences) Page in Dark Mode:
Add-ons Manager (about:addons) Page in Dark Mode:
Advertisement
About Pages in Dark Mode:
Error Pages in Dark Mode:
If you also want to enable dark theme mode support on all pages in Firefox, following steps will help you:
1. Open Mozilla Firefox and type about:config in the addressbar and press Enter. It’ll show you a warning message, click on “I accept the risk!” button. It’ll open Firefox’s hidden secret advanced configuration page i.e. about:config page.
2. Now type dark-mode in Search filter box and look for following preference in the window:
browser.in-content.dark-mode
The preference value is set to false by default, which means dark mode is not enabled everywhere in Firefox browser.
3. To enable dark mode support on all pages, double-click on browser.in-content.dark-mode preference and set it to true. Alternatively, you can right-click on the preference and select Toggle option.
4. You’ll need to restart Firefox to apply changes. If you have opened multiple tabs and you don’t want to lose them, you can restart Firefox without losing tabs using methods given in following tutorial:
[Tip] How to Restart Mozilla Firefox Without Losing Tabs
That’s it. After restart, you’ll get dark theme mode everywhere in Firefox browser.
IMPORTANT TIP:
To enjoy this trick, you’ll need to enable dark app mode in Windows 10 operating system. Check out following tutorial to learn how to enable dark app mode in Windows 10:
[Tip] Enable Dark or Light Theme Modes in Windows 10
Also Check:
[Fix] Disable Forced Dark Theme Mode in Mozilla Firefox in Windows 10
Tried the steps and didn’t work…please let me know what to do
I believe this config entry was changed recently. An alternative is to change –
ui.systemUsesDarkTheme
to:
2 = Dark
0 = Light
3 = No Preference
(You may need to create this entry and it requires a browser restart.)
RobertJ – THANK YOU! Finally!… Steps didn’t work for me either.
I happen to be running:
ArcoLinux
KDE Plasma: 5.19.5
KDE Frameworks: 5.74.0
Qt Version: 5.15.1
Kernel: 5.8.9-arch2-1
Firefox 80.0.1 (64-bit)
Even with the Plasma Integration extension installed in Firefox, it simply would not take the system theme. Setting Dark Theme manually via “Customize” would give me the dark tabs, menu, and other portions of Firefox, but NOT the settings, new tab, warnings, other pages, and not the Library [bookmarks, downloads, history] window either.
Changing the one setting you listed to ‘2’, everything INSTANTLY changed to Dark; no restart required.
However, the only thing that still will not change for me is the Library window – everything else is now dark. Hopefully I can figure that out at some point, but for now, I’ll take what I can get.
What about the shorthand menus, and all menus for that matter, they do not change color, do not adjust to them and look awful!
This worked, thanks RobertJ. The only thing that’s still not dark for me is moz-extension pages. Protected by the browser, so Dark Reader can’t do anything about it, and this config rule doesn’t work either. Does anyone have any suggestions?
It’s for my password manager and everytime I open it I’m just blinded by the page
Hi,
From Firefox 96 (since today, January 11, 2022) you need to set:
browser.theme.toolbar-theme –> 2
browser.theme.content-theme –> 2
And if you want, also:
devtools.theme –> “dark”
Update:
You need to set ‘0’ on browser.theme.toolbar-theme and not ‘2’. Because ‘2’ stands for “auto”.
0 -> Dark
1 -> Light
2 -> Auto