This tutorial should work for Mac / Windows / Linux and will allow the PDF viewer in Firefox to have Dark / Lite automatic switching depending on the system theme.
(If you have a Mac, this tutorial works great with the app Dark Mode Buddy, which allow switching system themes depending on ambient lighting conditions. Example, being outside and moving your laptop inside will switch from light to dark automatically. Why Apple doesn’t build this into the OS natively, I don’t know!)
1. Open Firefox and press Alt to show the top menu, then click on Help → More Troubleshooting Information
2. Click the Show in Finder button beside the Profile Directory entry
3. Create a folder named chrome in the directory that opens
4. In the chrome folder, create a CSS file with the name userContent.css
5. Open the userContent.css file and insert:
@media (prefers-color-scheme: dark) {
#viewerContainer > #viewer > .page > .canvasWrapper > canvas, #viewerContainer > #viewer > div.spread > .page > .canvasWrapper > canvas {
filter: grayscale(80%);
filter: invert(80%);
}
}
6. On Firefox’s URL bar, type about:config.
7. Search for toolkit.legacyUserProfileCustomizations.stylesheets and set it to true.
8. Restart Firefox and fire up a PDF file to see the change!
If you want to make the PDF background darker or lighter, play around with changing the values. Both values should be the same and can range from 60-100%. Don’t forget to restart Firefox if you do change these values later on.
(This tutorial was found here, but I added the ability for automatic light switching and page side by side view)