HEre is the code I have,

1 changes the unread message BG color. 1 changes the header panel to dark grey shown in image. 1 changes the background color or read messages to a slightly darker grey:

(The forum is adding "1." to the code below, that is not actually there and cant remove it here in the editor, it keeps adding 1's when I post this.)

/* Set colour of unread in thread pane/message list */

1. threadTree tbody [data-properties~="unread"] {

.tree-table,

.card-container {

background-color: #caede2 !important;

}

/******Adjust and color unified toolbar******/

1. unifiedToolbar {

 height:  60px  !important;
 padding-block:   1px  !important;
 margin-block:    0px  !important;
 background:  #6D859C  !important;
 color: white  !important;

}

}

.tree-table, .card-container {

 background-color: #f0f0f0 !important;

}

For the unified bar, try this:

unified-toolbar {background-color: AccentColor !important;}

The example in the picture uses the AccentColor, but any colour is possible.

For the unified bar, try this:

unified-toolbar {background-color: AccentColor !important;}

The example in the picture uses the AccentColor, but any colour is possible.

Like this? Im not sure where to paste that code, but if this is right, it did not effect it. Instead it changed another part:

This is the text of the code I have right now (before trying your change): https://ctxt.io/2/AAD4_F7sEA

For the unified bar, try this:

unified-toolbar {background-color: AccentColor !important;}

The example in the picture uses the AccentColor, but any colour is possible.

It did not work unfortunately. Here is the result

Im not sure if I am pasting your line of code in the right spot, idk. I dont know any code at all. I tried sharing a link to the txt file with the code and my post got blocked.

Try it with the default theme, not the one you have with the leaves.

Try it with the default theme, not the one you have with the leaves.

it still only changed the color that same spot in the image. Not the header.

this is my code currently: https://justpaste.it/hoaq6

Your code has a background-color statement and a background statement. Remove or comment out all lines except the one I provided.

Your code has a background-color statement and a background statement. Remove or comment out all lines except the one I provided.

Sorry I dont understand, Are you able to paste it here, the full text that I shared but with the mod your refering to?

There Are multiple things referring to background color because there are different backgrounds like the unread message background versus the header background.

I pasted the text of the code in that text share link above

Just do a test with the userChrome containing the single line I provided. Use any colour you like. After you confirm it works, you can add other css.

Just do a test with the userChrome containing the single line I provided. Use any colour you like. After you confirm it works, you can add other css.

Ah thanks, that worked!

I added one more line of code, that worked too, but then tried a 3rd, and does not work. I have a feeling its the way im pasting it, like Im missing brackets or something, I dont know

Folder Pane and Folder Pane Header:

#folderTree,#folderPaneHeaderBar {
  background-color: pink !important;
}

Folder Pane and Folder Pane Header:

#folderTree,#folderPaneHeaderBar {
  background-color: pink !important;
}

Hmm, no luck on that one.

"Folder Pane and Folder Pane Header:" also and without that line

1. folderTree,#folderPaneHeaderBar {

 background-color: pink !important;

}"

With the following css:

#folderTree,#folderPaneHeaderBar {
  background-color: pink !important;
}

#folderPaneWriteMessage{background-color: yellow !important;
color: black !important;}

the result is shown in the attached picture.

With the following css:

#folderTree,#folderPaneHeaderBar {
  background-color: pink !important;
}

#folderPaneWriteMessage{background-color: yellow !important;
color: black !important;}

the result is shown in the attached picture.

Interesting, that code by itself works, but when added to my other customizations CSS I have, it does not work.

The css is executed in the order in which it is shown in the file, so you might need to rearrange blocks to make it work, if one block overrides another.

The css is executed in the order in which it is shown in the file, so you might need to rearrange blocks to make it work, if one block overrides another.

Ah that worked, put it at the top. Thanks!

Now I need to to figure out the part below it. And a few other areas. This is the tutorial Ive been following, been trying to find these area by keywords and also using hex color code from the tutorials screenshot to Control+F find it in the tutorial. But a lot is not matching up.

Any ideas what these 2 sections would be called? (the red X's) Ill try to find them on my own in the code so I dont keep bugging you for every little change

The blank section of the Folder Pane, plus the tree and header, can be coloured with this css (see picture):

#folderTree,#folderPane,#folderPaneHeaderBar {
  background-color: pink !important;
}

The other element is defined as .card-container. See these topics for examples:

https://support.mozilla.org/en-US/questions/1524687#answer-1751391 https://support.mozilla.org/en-US/questions/1455376 https://support.mozilla.org/en-US/questions/1447610

The blank section of the Folder Pane, plus the tree and header, can be coloured with this css (see picture):

#folderTree,#folderPane,#folderPaneHeaderBar {
  background-color: pink !important;
}

The other element is defined as .card-container. See these topics for examples:

https://support.mozilla.org/en-US/questions/1524687#answer-1751391 https://support.mozilla.org/en-US/questions/1455376 https://support.mozilla.org/en-US/questions/1447610

I just noticed the URL in my previous post never showed and then i tried updating it and my post got shadow banned, so w/e. anti spam system i guess.

But anyhow, thanks, I went through those, its coming along now!

What about the selected tab? I tried these but none applied to the area with the Red X.

TRied some here from this post too: https://support.mozilla.org/gl/questions/1425743

/*******Fix tabs***********/

1. tabmail-arrowscrollbox { background-color: #E4E4E6 !important; }

.tab-line[selected=true] { background-color:transparent !important; }

root { --tabs-toolbar-background-color: #E4E4E6 !important; }

Here is some css for the tabs:

:root {
  --tabs-toolbar-background-color: accentcolor !important;
}

.tab-background[selected=true] {
  background-color:orange !important;
}

.tab-label {
color:white !important;
}

.tab-label[selected=true] {
color:black !important;
font-weight:bolder !important;
}

.tab-line  {
  background-color:transparent !important;
}

/* tab icon & close colours */
.tab-icon-image{stroke:white !important;}

.tab-icon-image[selected=true]{stroke:black !important;}

.tab-close-button{color:white !important;}

.tab-close-button[selected=true]{color:black !important;}