This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Theme Changes Some Components to Dark-mode Despite Override

  • 6 replies
  • 0 have this problem
  • 2 views
  • Last reply by zeroknight

more options

Hiya,

I use a theme which some years ago (after a change in the way Firefox handles dark-mode preferences) changed all UI and websites to use dark-mode. I was able to keep using the theme, and mostly override this behavior by setting:

`layout.css.prefers-color-scheme.content-override = 1`

However, this didn't take for some components, such as the sidebar and bookmark editor window, which still continue to use dark-mode.

Is there any way to completely disable dark-mode everywhere, and still use my preferred theme?

Cheers, Afraz

Hiya, I use a theme which some years ago (after a change in the way Firefox handles dark-mode preferences) changed all UI and websites to use dark-mode. I was able to keep using the theme, and mostly override this behavior by setting: `layout.css.prefers-color-scheme.content-override = 1` However, this didn't take for some components, such as the sidebar and bookmark editor window, which still continue to use dark-mode. Is there any way to completely disable dark-mode everywhere, and still use my preferred theme? Cheers, Afraz

Chosen solution

You can edit the theme manifest file and change "color_scheme" to "light" then either submit it as a new theme or install it on Developer Edition with signature enforcement disabled.

Read this answer in context 👍 0

All Replies (6)

more options

We can rule out `userChrome.css`, because I don't have one :)

It could well be an "incompatible" theme. I got it from the normal theme page for Firefox, and this started happening some time ago, when Firefox changed the way themes effect dark-mode.

I'd really like to keep using this theme though, so am willing to create the necessary entries in a `userChrome.css`. Trouble is, I have no idea what I need to set. Is there documentation somewhere I can look up for changing the appearance of all the extra UI windows like the history browser, bookmarks browser, etc.?

more options

Chosen Solution

You can edit the theme manifest file and change "color_scheme" to "light" then either submit it as a new theme or install it on Developer Edition with signature enforcement disabled.

more options

Marked @zeroknight's answer as correct, but it bears further explanation.

This is what needs to be added in the manifest:

``` ...

   "properties": {
     "color_scheme": "light"
   }

... ```

It seems that if a theme doesn't set `properites.color_scheme`, then Firefox defaults to "dark" (my OS is set to light), which is disappointing.

more options

Themes are meant to override the OS theme. The light/dark color scheme is decided by the theme's toolbar and text colors if one isn't specified.

more options

So given the following manifest, Firefox would use "dark"?

{

 "theme": {
   "images": {
     "theme_frame": "fox1_head.png"
   },
   "colors": {
     "frame": "#12455e",
     "tab_background_text": "#ffffff"
   },
 },
 "version": "2.0",
 "name": "Have a Light Fox Dream",
 "manifest_version": 2,
 "description": "Enjoy more!"

}

Modified by afrazkhan

more options

afrazkhan said

"tab_background_text": "#ffffff"

Light text will make the color scheme dark.