Dark reader
Firefox
A place to discuss the news and latest developments on the open-source browser Firefox
I made my own with Stylus. At its simplest it's 2 lines of CSS which pales in comparison to what Dark Reader is going with, and then I have one section for exempted websites, and two sections for websites I use a lot that needed specific small fixes. It uses basically no resources, and doesn't slow anything down.
The one downside is that because it uses CSS filters, some colors become less brilliant. This is a known flaw with how CSS calculates colors for hue-rotate
.
Pasted in a comment below.
Install Stylus > Write New Style > Import and then copy/paste this in. Keep in mind that I removed a lot of my specific tweaks for sites I use, because that's PII. You will encounter many more weird issues on random sites than you do with DarkReader, but if you're used to working with userCSS you'll probably have no issues fixing those. The way this essentially works is by inverting your entire browser screen, then rotating the hue so the colours of website themes aren't weird, then it inverts images back to normal. I'm sure there is a way to do this without inverting the images in the first place, but it would involve one hell of a lot more code than this. I wrote this originally in about 3 minutes.
html, iframe {
filter: invert(1) hue-rotate(180deg);
}
img, div[background-image], div[style*="background-image"], video {
filter: invert(1) hue-rotate(180deg);
}
@-moz-document domain("lemmy.ml"), domain("ultimate-guitar.com"), domain("open.spotify.com"), domain("discord.com"), domain("localhost") {
/* Exemptions for sites that already have a dark mode */
html, iframe {
filter: none;
}
img, div[background-image], div[style*="background-image"], video {
filter: none;
}
}
@-moz-document domain("youtube.com") {
#movie_player {
filter: invert(1) hue-rotate(180deg);
}
video {
filter: none;
}
}
@-moz-document url-prefix("https://www.google.com/maps") {
div[aria-label="Street View"] canvas, div[aria-label="Photo"] canvas, button[data-photo-index] {
filter: invert(1) hue-rotate(180deg);
}
div[role="img"] {
filter: none;
}
}
Is it possible to go dark without extensions? I switched from Chrome to FF in Android because they got rid of that native feature... but I feel Dark Reader slows down my navigation.
@kratoz29
Is your Android phone on dark mode ? If so, Firefox will be on dark mode too.
If it's for the PDF, can't say, I don't think even Foxit Reader can transform PDF documents i'to dark mode ones on the fly (haven't tried on fact).
@QuazarOmega
Yeah, it is in dark mode, but not all webpages support it, that is why the Chrome workaround did, and these nice extensions.