Dark mode

[z16]

I kept the title deliberately vague, because there are a number of ways to implement this. Currently you can select a color as the background and make it black, but opening a new tab still has a full white page and only fades to black slowly, which means a bright flash across the screen for a second, which is really jarring if you work on dark backgrounds all the time. And since I open new tabs all the time, this has become so much of an issue that I started reusing older tabs just so I won't have to open a new one, even if I would have wanted to. I realize not many people will be bothered by this as much as me, but fortunately I think there are non-intrusive options to make this work well for everyone.

One way would be to offer a "Dark Mode" option, which defaults to a dark background and disables the fade. Another would be to make an option to disable the fade directly, so it immediately loads the preferred background image or color. Yet another would be to make the default background black, before the fade. So it would fade from black to an image, or to any other color. I think much fewer people would complain about fading from black to something else, than the other way around.

As I said, many ways to approach it, but would appreciate a solution, as the current new tab page is pretty jarring for someone like me. I'm not really sure why my Dark Reader extensions is of no help here, it says the new tab site is protected by the browser. (Though I am a bit confused about how Tab for a Cause can work if that was the case 😅)

[kmjennison]

@z16 Thanks for your input! I agree this would be a good feature.

The first version of this (and simplest) is to make the tab page less jarring for people who use dark mode on their browser or laptop, which likely means removing the flash of the white background.

Can you give a quick overview of how you enable dark mode (Dark Reader extension, OS settings, something else?) to help us test out some options?

[z16]

I use the Dark Reader extension, personally. I also have my OS set to dark mode as far as it is possible (on Windows 10, so I just set the default app color to Dark), but this has no effect on my browser. The Dark Reader extension is the only thing affecting the site display on my end.

[TimonLukas]

@kmjennison The best option I am aware of is @media (prefers-color-scheme: dark) { } (described in detail here). It is supported by almost every browser for a versions already, older browsers simply ignore the block, and at least Chrome supports it on Windows and Mac synchronized with the system, so it's likely that a lot of people will use it (and I'm sure other browsers do too, I'm just not sure about those!). Hopefully Dark Reader will also support it in the not-so-far future.

With this tag, a simple quality of life improvement could be to set the initial flash color to be black. You could maybe throw in some opacity for the background picture, but honestly changing the flash would already be enough for me.

Hope this helps! Thank you for the extension :)

PS: I would have loved to do a PR for you guys, but the setup manual sadly errored out on my Mac (some version mismatches, some native Node modules couldn't compile, ...) and I don't want to have to debug that stuff in my free time, so I'll sadly have to hold off and can just give advice :)