How can I change the default background tab font color?
I just got updated to v29. Whenever I have more than one tab open, any font on the background tabs is white. It's hard to read and I'd like to change it so the font is black like on the active tab.
Chosen solution
Why would you not recommend using the userChrome.css file? And if I wanted to do that, how would I do it?
Read this answer in context 👍 0All Replies (7)
- Install Stylish and restart Firefox when prompted.
- Click the ≡ Menu Button and choose Add-ons.
- In the Add-ons Manager, click User Styles on the left.
- Click the Write New Style button at the top. Paste the following in the text box, give the style a name, then click the Save button.
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); .tabbrowser-tab .tab-label { color: black !important; }
If you don't want to install an add-on, you can use the userChrome.css file instead, but I don't recommend it.
Perfect! That sorted it out. Thank you so much!
Chosen Solution
Why would you not recommend using the userChrome.css file? And if I wanted to do that, how would I do it?
You can also look at the Classic Theme Restorer extension.
- Classic Theme Restorer: https://addons.mozilla.org/firefox/addon/classicthemerestorer/
- You can find the settings of the CTR extension via its Options/Preferences button on the "Firefox/Tools > Add-ons > Extensions" page.
- You can find extra toolbar buttons and more toolbar settings in Customize (3-bar Firefox menu button > Customize)
See also:
pinkpeonies wrote:
Perfect! That sorted it out. Thank you so much!
You're welcome.
rosawood wrote:
Why would you not recommend using the userChrome.css file?
- Users have to find their profile folder, then create a subfolder in it.
- The file must be created manually. The file name is case-sensitive. Windows doesn't display file extensions by default, which makes it likely that the file will end up named .css.txt which is incorrect.
- Firefox must be restarted for the changes to take effect.
- All styles are lumped together in one file, while Stylish allows separating and toggling styles on and off on-the-fly.
rosawood wrote:
And if I wanted to do that, how would I do it?
That's explained in the article I linked to. Simpler directions:
- Copy the CSS code to the clipboard.
- Start a text editor like Notepad and paste the clipboard contents in a new file.
- Save the file as "userChrome.css" on your desktop — put exactly that in the save dialog box, including the quotes.
- In Firefox, type about:support into the address bar and press Enter.
- Click the Show Folder button.
- In the Windows Explorer window that opened, create a new folder called chrome
- Move the userChrome.css file from the desktop into the chrome folder.
- If you want to add additional styles to an existing userChrome.css file, paste the code at the bottom of the file and make sure the @namespace line appears only once at the top.
Note that you can use @import url(); lines in the userChrome.css file to use separate .css files each with their own set of style rules.
These @import rules need to appear before the @namespace line in the userChrome.css file and each of those separate .css files need to have their own @namespace line at the start of the file.
That is what I use to make it easier to maintain changes between various Firefox development builds or quickly disable a specific rule set.
A much easier way to to do this is to install the Tab Mix Plus extension for Firefox. It not only lets you specify any tab text and/or background colors you want (from an easy, intuitive color-picker), but gives you all kinds of control over how your tabs and tab menus behave. It's great!