Become Website Savvy!

Get our weekly email containing easy to understand advice, tips, tricks and recommendations.

Join thousands of small business owners who've taken charge of their online presence!

How to fix dark theme issues with Firefox in Linux

It took me quite a long time to finally figure this out but thanks to some handy guides out there (and some people that are clearly smarter than me) I did.

My issue was that text in fields was barely visible:

To fix this, in your home folder, navigate to:

~/.mozilla/firefox/<profile directory>/

Note: the profile directory will usually be a random set of letters and numbers such as zee4bhai.default or similar. Enter this directory and check to see if you have a /chrome folder. If not, create it with mkdir chrome and enter it.

Now create a new file called userContent.css like so (subbing out your preferred editor of course):

nano userContent.css

Paste the following into the file and save:

input {
  border: 2px inset white;
  background-color: white;
  color: black;
  -moz-appearance: none !important;
}

textarea {
  border: 2px inset white;
  background-color: white;
  color: black;
  -moz-appearance: none !important;
}

select {
  border: 2px inset white;
  background-color: white;
  color: black;
  -moz-appearance: none !important;
}

input[type="radio"],
input[type="checkbox"] {
  border: 2px inset white ! important;
  background-color: white ! important;
  color: ThreeDFace ! important;
  -moz-appearance: none !important;
}

*|*::-moz-radio {
  background-color: white;
  -moz-appearance: none !important;
}

button,
input[type="reset"],
input[type="button"],
input[type="submit"] {
  border: 2px outset white;
  background-color: #eeeeee;
  color: black;
  -moz-appearance: none !important;
}

body {
  background-color: white;
  color: black;
  display: block;
  margin: 8px;
  -moz-appearance: none !important;
}

Now restart Firefox and you should be good to go!

Happy browsing!

Mike

Mike Johnston

Mike is the founder and editor of CMS Critic. He consults with vendors and the public to help them find the right products for their websites and businesses. When he's not working here, he's off mixing cocktails for his wife's website, The Kitchen Magpie. You can check out some of his great cocktail shots over on Instagram.