More prominent unread mails in Thunderbird

Spot unread mails in Thunderbird threaded card view more easily

I host my email the old-school way, with a traditional Postfix+Dovecot server. I don’t like webmail clients, mainly because everything is done in the browser nowadays, not that they don’t get the job done. Thunderbird has been the best option for a desktop email client so far. Every other option does at least something shady, or has some important-enough feature locked behind a paid subscription. I wouldn’t mind paying for a subscription, but my email usage is so light it’s hard to warrant a subscription just for a client. I do donate to Thunderbird, but only small sums on a semi-random basis.

By default, Thunderbird uses a bold font for threads with unread messages, and the thread badge is highlighted. There’s also a miniscule green dot on the letter thread icon for threads that have unread messages. Don’t know about you, but I really need to squint to see the difference between a read thread and one with unread messages, and the same goes for the individual cards of unread messages.

If you think spotting the unread mails is easy enough already, I kinda agree with you. When you look at it in this context, as in “am I able to spot the unread mail”, it does feel they’re quite obvious. But on a quick glance, I’ve found that I need to apply a filter to spot the unread threads.

Here’s what the view looks like by default:

Thunderbird default card view with a read thread and one with an unread message

And here’s an example of a more prominent version, with a very simple tweak:

Thread with unreads after applying custom CSS

…and with an expanded thread:

Expanded thread with unreads after applying custom CSS

Applying the CSS

Bear in mind, this is a really simple version. With the selectors, someone who actually knows CSS can do all kinds of great things. We’re just going to change the text color for the thread card, and the unread message card.

First, locate your Thunderbird user profile. Help for this can be found [here](https://support.mozilla.org/en-US/kb/profiles-where-thunderbird-stores-user-data#w_how-do-i-find-my-profile.

On the Flatpak version of Thunderbird, the Open Folder button doesn’t work (small things like this are really annoying with Flatpak, although otherwise I really like them). The profile folder is under ~/.var/app/org.mozilla.Thunderbird/.thunderbird. In my case, there’s the default folder, then another with .default-esr in the folder name.

Under the profile folder, you should make a directory named chrome, and under it the file userChrome.css. If the folder and file already exist, edit the existing one.

“chrome” here is referring to UI elements, like chrome on a motorcycle, not the browser from Google.

In userChrome.css, put the following contents:

1
2
3
tr.children[data-properties*="hasUnread"], tr[data-properties*="unread"] {
    color: blue !important;
}
  • tr.children[data-properties*="hasUnread"] matches the thread card (top one)
  • tr[data-properties*="unread"] matches the unread message in the thread.

The last bit is to tell Thunderbird to allow custom CSS. This will be familiar to those who have tweaked Firefox’s about:config. Open Settings > General, scroll to the bottom and click Open Config editor.

In the config editor, search for toolkit.legacyUserProfileCustomizations.stylesheets and set the value to true.

Restart Thunderbird and the tweak should be applied!