How to enable dark mode?

I’ve seen a bunch of references to dark mode, but there does not appear to be a “Dark Mode” button in the Appearances preference, or any other that I’ve checked. I’m running the latest nightly.

You only need to set a dark panel color, then other colors will automatically adjust based on it.

Ah, so there isn’t a pre-set default dark mode color scheme?

There is a theming app, but I didn’t like the presets I saw. Then I figured out that basic dark mode is built into the OS, it just isn’t called that. Go to Preferences->Appearence->Colors tab. Then for Panel background, move all of the sliders to the left, and now you have “Dark Mode”

“Dark mode” is a web sites thing. They somehow get some of your system colours and adapt their look regarding that. nephele recently added a dark mode to Haiku bug tracker.
nhtello made some dark colour schemes for Flat control look. You can find them on Flat github page.

Thanks everyone! One of the things I am picking up about Haiku is that often the functionality I want is there, it’s just not very obvious how to enable it.

2 Likes

Honestly, I am a Dark Mode addict. And Haiku literally needs a Dark/Light Mode system setting. You don’t have to adopt the modern web UI for everything, it’s boring IMO. But Dark/Light mode should be a consideration in any modern OS GUI, especially since most modern apps have their own Dark/Light/System setting.

3 Likes

I disagree. People looking to change the appearance from light to dark should be capable of deducing that this is done in the “Appearance” prefs. There they probably figure out that it’s a colour related endavour, and find the “Color” tab. Here they discover that the grey that they see everywhere appears in a box labeled “Panel background”. I’m confident they’ll make the connection that the colour picker below is used to change that colour. The live-changes make sure they can tweak the colour (and automatically all secondary colours) until they get the exact dark hue they want, not what someone else decided is the correct dark mode value.

For programmers the OS provides the functions IsDark() and IsLight() to tune their custom colours and a system message B_COLORS_UPDATED to support live changes.

2 Likes

Eh, that is not only a website’s thing. Windows and WinUI3 have global system settings for that; macOS does too. In GNOME/KDE, you have the same setting; I do not use those, but I still can use, e.g. GTK_THEME=“Adwaita:dark". And as far as I can recall, browsers got those after it was first available on all OSes, they also respect system settings. I also wanted to try/see how it looks in Haiku, but manually changing colors was never my thing; I do not know what will look good, nor do I want to experiment with that. A global option for that would be very nice. Those who want customization can, of course, do just that.

1 Like

Well in Haiku there is a slider to select how dark you want things to be, instead of just two choices.

Some people want a dark mode that’s just dark grey, other want pitch black for higher contrast. So in the end, it’s either a slider to pick whatever color you want, or a handful of checkboxes. The slider ends up being the simpler option.

4 Likes

I think the non-obvious part is that changing the panel color also adjusts other colors. That wasn’t clear to me at all, and a reason I never fiddled with that, as I don’t enjoy the micromanagement of picking a proper color for each UI element.

2 Likes

The better solution would be to have 2 predefined configs, with additional customization slider for those who needs it. Haiku already comes with the predefined color setting for Light mode, so there’s nothing wrong in having the predefined setting for Dark mode too.

1 Like

Isn’t there an “automatically pick secondary colors” checkbox just there in your face? I don’t change default colours, so it doesn’t really affect me, but I thought that was a great idea when waddlesplash implemented it some two years ago, precisely to avoid that micromanagement for those who wanted to change the general aspect and not be concerned with the exact tint of each of about 40 colours.

1 Like

I think there is no real automatic solution since dark themes are more than just inverted color values. Vivid colors have to be desaturated and also the combinations and contrasts between color pairings can be tricky with all the layers and shades.
But of course thankful for having those options and helpers!

If need I use ThemeManager to switch light/dark theming, you can adjust to your own liking and save your personal preferences in a “new” theme there.

1 Like

I think the non-obvious part is that changing the panel color also adjusts other colors.

That’s exactly it. Once you’ve done it once, it’s very obvious and works well. But the first time, one just sees “Panel background”, “Progress bar”, and “Window tab”, each with their own set of sliders. And there is a “Defaults” button that sets things to the default light, which makes it seem like there should be a “Default Dark” somewhere. If there was a “Dark” and “Light” button that moved the sliders to a preset for each, entire thing would suddenly be very clear.

2 Likes

Although it seems simple, it is not at all obvious. I, like many others, had to ask how to do it.

I also stand by a basic Dark/Light mode system setting. Why do many apps blind me when I first open them? Because the system has no dark mode setting. If we did, apps like IceWeasel would read the system setting and the “Automatic” which is currently the default would actually work and make sense. Sure, IceWeasel and most apps that support dark mode usually have their own app settings - but using system settings is generally the default in a modern app.

4 Likes

Seems like a bug in Iceweasel. As humdinger already mentionned, the OS does provide a way to check if the user chosen settings are dark or not, and WebPositive already makes use of that to switch websites to dark mode when the selected panel color is dark.

1 Like

I think it’s globally a problem of gtk apps. They don’t detect system colours and so don’t adapt properly. Perhaps is it also a problem of default gtk colour scheme that doesn’t exist in the two flavours?
Anyway in this case panel colours are also depending of Iceweasel settings. Unfortunately, it doesn’t follow Haiku colour scheme even if you’re choosing system theme auto and still default to light. Then when asked for system colours, it seems to send values from its own scheme instead. If it was able to switch its own scheme to dark, the switch of web sites would work. It already does if you set a dark scheme in Iceweasel.

If there were say a Dark/Light mode setting on the Appearance/Colors screen that reset the sliders to defaults, seeing the sliders move to their default position would drive home the idea that adjusting the slider is the key to Dark mode settings, and may even invite them to play around with the default settings. Conversely if they started playing around with the sliders, the Dark/Light “setting” should also change without resetting the default colors, thus also reinforcing the idea that the two concepts were tied together.

2 Likes