An elegant theme modification for Thunderbird 🐦️

Warning

This theme is currently an early work-in-progress! Only the Mail and Calendar sections are almost finished as of now. Other parts of Thunderbird may appear broken for some time. Use at your own risk!

The only functional use case for now is just reading emails and viewing calendar events.

Version support

The theme works best on the latest stable release.

The latest ESR release may work but not guaranteed.

Installation

Start by downloading the latest release from this repository.

1. In Thunderbird, go to Menu > Help > Troubleshooting Information.
2. Scroll down to the Profile Folder row and click Open Folder.
3. Inside your Thunderbird profile folder, create a new folder named chrome.
4. Extract the downloaded ZIP file and navigate its contents.
5. Move the extracted contents to your newly created chrome folder.
6. Move out the user.js file to your profile folder.
7. Restart Thunderbird to apply the changes.

Next, follow the Adjustments section to fully utilize Lightbird.

Adjustments

Thunderbird 140+ now offers Mica and Acrylic transparency for Windows 11 users. To enable it, toggle the following preferences in Advanced Preferences.

• widget.windows.mica - set it to true.
• widget.windows.mica.toplevel-backdrop - set it to 1 (Mica) or 2 (Acrylic).
• Important: Make sure your theme is set to System theme — auto for it to work!

For a definitive Lightbird experience, install the following add-ons:

• Auto Profile Picture
• Thunderbird Conversations
• uBlock Origin (optional)

Customization

Advanced Preferences

You can create and toggle these Boolean preferences if you feel like it.

• lightbird.logo.hide - hide the logo at the top-left of the window.

Custom CSS

Lightbird heavily uses root variables stored in lightbird/components/variables.css. You can modify this file or as a recommendation, create a CSS file to override them and then import it using the userChrome.css file.

Here's a sample custom.css that makes Lightbird red:

/* makes lightbird red */
:root {
  --selected-item-color: rgba(255, 0, 0, 0.1) !important;
  --lb-text-color: rgba(255, 0, 0) !important;
  --lb-panel-bgcolor: rgba(255, 0, 0, 0.05) !important;
}

And then, append this line in userChrome.css

@import "lightbird/custom.css";

Note

• This theme is incomplete and a work-in-progress
• Mica and Acrylic window materials only work on Windows
• Untested on macOS and Linux

Acknowledgements

The icons used for this theme are from Microsoft's Fluent UI System Icons

The bird and mail icon is derivative work based on Microsoft's Fluent Emoji

The font used in the Welcome page is Instrument Serif

Cloud background image by engin akyurt on Unsplash