Jazz up your new Thunderbird tags

Mar

2008

Reader Chuck recently asked about enhancing new labels for Thunderbird:

I’ve been trying to figure out how to change some of this stuff for a long time. My one question though - how do you change the label backgrounds for additional labels you have added(other than the default 5 that come with Thunderbird).

I realized that this is probably more common than one might think. So I’m going to share my answer with all of you.

This customization goes back to Personalizing Thunderbird’s chrome, but note that you can also do this with the Stylish Add-on for Thunderbird. In this case it’s not necessary to dig into your userChrome.css file, but if you want to than here are instructions.

First you need to create some new tags in Thunderbird by going to Edit > Preferences > Display > Tags (Linux & Solaris) or Tools > Options > Display > Tags (Windows) and adding them. Pay close attention to which color you picked so that you can find out the color value you need by hovering over this image –>.

Open up userChrome.css or your New Stylish Script dialog and copy this code in there once for each tag you create.

/* Change these styles to make messages with your new tag shine */
/* Normal message row */
treechildren::-moz-tree-cell(lc-******) {
    border-bottom: 1px solid #FF0000 !important;
    background-color: #FFCCCC !important;
}
/* Message row text */
treechildren::-moz-tree-cell-text(lc-******) {
    color: #000000 !important;
}
/* Message row background when selected */
treechildren::-moz-tree-cell(lc-******, selected) {
    background-color: #FF0000 !important;
}
/* Message row text when selected */
treechildren::-moz-tree-cell-text(lc-******, selected) {
    color: #FFFFFF !important;
}

Now, we are going to need to replace ****** with hexadecimal (0-F) characters representing the color you chose. These colors are in the form RRGGBB with each hexadecimal pair representing the intensity of Red, Green, and Blue respectively. You can also completely customize the color, border and whatever else for this tag by changing the CSS within each selector in the code above.

You can also use Twister MC’s label colors (thank you Twister MC) but it’s good to know how to customize it however YOU want, because the customizations don’t stop there.

How have you tweaked the look of your tags in Thunderbird? Share in the comments!

If you liked this post, please help me share it