Background colors change.

[Butch76]

I am using FF V92 64 bit and want to know if the dark and teal colors can be changed or are they baked in?

[LIMPET235]

Moving to Firefox Support...

&...
To post images here..
After you've taken the screen shot/s...
Reduce it/them to around 600 x 500 or so in your favourite image editor, (Be sure to remove any personal info.)
& upload them to your favourite image hosting site.
> https://imgur.com/
> https://imgbox.com/
> http://www.imagebam.com/
> http://postimages.org/

eg;...Using "postimages.org",
0/. Upload your image.
1/. Select > from the "Do not resize" drop down, 640 x 480.
2/. No expiration. (Leave as default or as you require.
3/. Choose > Images to upload.
3a/. After the image/s have been uploaded.
4/. Select > Hot Link for Forum.
5/. Paste that link in your forum thread.
6/. Your image will be displayed in your post.

[morat]

Try something like:

Code: Select all

/* Firefox userContent.css */

:root {
  --in-content-accent-color: red !important;
  --in-content-primary-button-background: lime !important;
}

userContent.css
http://web.archive.org/web/202102172114 ... ontent.css

Reference
http://searchfox.org/mozilla-release/so ... on.inc.css

Remember to set the toolkit.legacyUserProfileCustomizations.stylesheets preference to true, then restart.

Similar thread
http://old.reddit.com/r/firefox/comments/ntd2oh

[jscher2000]

As a footnote, to style the Settings page, morat is correct that these rules go into a userContent.css file (and not a userChrome.css file, which is the file that failed to work in the Reddit thread).

[limp]

morat's

:root {
--in-content-accent-color: red !important;
}

succeeds in removing that horrible cyan/tea/garbage--whatever you want to call it--color from two items
which heretofore have defied all my attempts to change their color using "official" CSS:

A category in the "selected" state in Add-ons Manager;
The check marks in the search shortcuts list in Settings > Search.

However, that awful color remains invulnerable to change in the following "about:" pages:

Remote Debugging(about:debugging);
Protections Dashboard (about:protections);
Saved Logins (about:logins);
Studies (about:studies).

[Butch76]

Thanks for all the support, actually, I was looking for a way to change the teal color for the following popups in FF



and

[limp]

It depends on what type of dialog it is and where it appears. Use Browser Toolbox to get its ID or class name,
and enter your code in userChrome or userContent, whichever is appropriate for a given dialog. Basically, the idea is this:

Code: Select all

/* Dialog buttons */

   .dialog-button-box button[dlgtype="accept"]
     { background-color: #0084c0 !important;
       color: #eee !important; }

   .dialog-button-box button[dlgtype="accept"]:hover
     { background-color: #00a2ed !important;
       font-weight: bold !important; }

   .dialog-button-box button[dlgtype="cancel"]
     { border: 1px solid #666 !important;
       background-color: #2b2a33 !important;
       color: #eee !important; }

   .dialog-button-box button[dlgtype="cancel"]:hover
     { background-color: #5b5a66 !important;
       font-weight: bold !important; }

...and for check boxes, like this:

Code: Select all

/* Check boxes */

   popupnotification
   checkbox:not([checked="true"]) image
     { background-color: #111 !important; }

   popupnotification
   checkbox:not([checked="true"]):hover image
     { background-color: #0084c0 !important; }

   popupnotification checkbox[checked="true"] image
     { background-color: #0084c0 !important;
       fill: #eee !important; }

   popupnotification checkbox[checked="true"]:hover image
     { background-color: #00a2ed !important; }