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