
Dark color: Things to know about color when adopting dark mode - sarunw
https://sarunw.com/posts/dark-color/
======
Kluny
I don't like dark mode. There are always lots of apps and websites that
haven't adopted the color guidelines, so I'll frequently be snapping from dark
black/grey to bright white, which is even harder on my eyes than just white
all the time. Turning down screen brightness is better I think.

~~~
psykus
On the other hand it's not as easy to adjust brightness on desktop monitors so
I appreciate having the option either way.

Software brightness control on desktop monitors is something I've wanted for a
while. Closest thing I've seen is a monitor with a built in light sensor that
has the option of auto adjusting independent of the computer.

~~~
chrismorgan
It has long been possible to adjust the brightness of monitors through
software. The trouble is that laptop displays and external displays do it in
two different ways, and the external monitor one is pretty much unknown and
unused by normal software.

Taking my laptop as an example: Windows has two APIs for adjusting screen
brightness, one of which only works for the internal display and one of which
only works for external displays; and sadly the brightness keys on the laptop
are uninterceptable and I have not come up with any way of linking the
brightnesses either. I went hunting and settled on some old freeware called
ScreenBright which I can invoke from the command line, so that now I just run
`b 0` for night time and `b 40` for most of the day (and up to 70% in certain
seasons—but 100% is pretty much always too bright where I use my external
displays). Since I arranged that workflow, I have also written a tiny Rust
program that interacts with the APIs directly which could replace it.

~~~
baroffoos
>and sadly the brightness keys on the laptop are uninterceptable

This doesn't seem to be true for most laptops. The ones I have used show a OS
graphic when you turn the brightness down similar to the volume. Have tested
this using linux on a dell xps and a macbook.

Unfortunately both still do not adjust the brightness of external monitors.

~~~
chrismorgan
On my previous laptop I ran Arch Linux with i3, and handled the XF86Brightness
keys myself. But at present I’m using Windows, and I haven’t found any means
of intercepting the keys: Windows handles them in some way that prevents me
from handling them myself.

------
1996
How I like dark mode: everywhere!

So I configure light mode (black text, white background) everywhere, then I
use NegativeScreen for Windows to invert colors.

Bonus: you can also setup a transformation matrix to convert all brightness to
red, giving you a red-on-black mode for use at night.

This is the only reliable way I know to get a perfect dark mode everywhere (in
outlook, terminal, notepad...) as many apps don't support dark mode or have
some half-assed support, but all of them have light mode now that the start
menu also has light colors support

(One exception on android: samsung browser get special mention for its dark-
mode that applies to all pictures)

~~~
tsm
What about seeing normal images and videos?

~~~
1996
If I'm watching during the day, I press on a key to toggle NegativeScreen on
or off.

If I'm watching night, I'd rather have a good night of sleep than a colour-
correct video. I don't care much about colour accuracy.

If you care try the Samsung browser for android. They seem to care about such
things.

------
xori
Not a fan, of the "don't use black, use dark-grey" mentality. As an
alternative, may I recommend "back lighting" your windows.

[https://i.pinimg.com/originals/97/1e/31/971e311093599ce52b99...](https://i.pinimg.com/originals/97/1e/31/971e311093599ce52b9919571d69b0db.jpg)

~~~
Avamander
I don't like and recommend using black because it causes purple ghosting on
most OLEDs, gray doesn't.

~~~
TeMPOraL
I don't know about Apple-land, but if we're going for generic advice, I'm in
favor of black on mobile, because it not only doesn't ghost purple on AMOLED
screens, it saves battery life in a very visible way.

~~~
Avamander
Measurements have shown that black and gray don't have a big difference in
power consumption. [https://www.xda-developers.com/amoled-black-vs-gray-dark-
mod...](https://www.xda-developers.com/amoled-black-vs-gray-dark-mode/)

------
Zekio
Well you can have "Shadows" in dark mode, though they would have to be shadows
made of white or light grey rather than black at least that is how I usually
do it.

Not sure how you would accomplish this in IOS, never done IOS development.

~~~
K0SM0S
Shadows in dark mode is an interesting design topic.

Experimenting quickly gets to you 'inconsistencies' with well-known principles
that work in light mode, otherwise simply the 'full color scale' so to speak.
It goes to show that light/dark mode cannot be a symmetry, it's a chiral*
transformation of the color space.

[* chiral is my way of saying it's like left/right, the two spaces do not map
directions the same, e.g. "from object color towards absence of color", what
we call a shadow, should theoretically remain the same direction in any
"mode"; e.g. a 'lighter shadow' feels unnatural, and feels more like a
'highlight'.]

My personal take is that dark mode lends itself very badly to using black as
the 'normal' / background color; it produces too much contrast if you want
colors to be decently saturated, and doesn't leave any room 'beyond' (darker
than back is impossible) for things like shadows or a "depth effect".

Thus dark grey is the way to go usually; and most of the usual rules of 'light
modes' apply (shadows to black, highlight 'lighter', invertable selections
etc; the only meaningful remaining changes are thus related to fonts, whose
'Light' parameter _l_ becomes its complementary _k_ in the n-bit range
(typically _k_ = 2⁸- _l_ ). And you'd usually slightly darken or desaturate
colors in general to reduce contrast for eye comfort.

You essentially retrieve a 'full color scale' space to work with, you're no
longer bound to >50% light for anything that should be visible.

It's a really interesting topic, I find. Speaking as programmer with no design
background nor particular talent. (just a demanding taste for aesthetics I
guess)

------
Nadge
Lots of varied, interesting opinions in this thread. For fans of dark mode,
there is a Firefox extension that lets you customise colors of every element,
and process the CSS in different ways. Been using it for a few years now, and
I prefer it to the Dark Reader extension that Firefox recommends.

[https://github.com/m-khvoinitsky/dark-background-light-
text-...](https://github.com/m-khvoinitsky/dark-background-light-text-
extension)

(not an affiliate, I just like it.)

~~~
pmoriarty
Take a look at the Stylish extension, which has hundreds of styles for various
websites that users created for it:

[https://userstyles.org/](https://userstyles.org/)

Using such pre-created styles is a lot faster, easier, and more convenient
than manually customizing each and every element by hand yourself.

Knowing how to do that is, of course, a good skill to have when you actually
do want to do something custom for which a pre-rolled style does not exist or
when existing styles do something you don't like.

~~~
Nadge
Oh wow, I like that, thank you. I'll get it installed once I'm home and look
at contributing in the future :)

------
chooseaname
How about don't use blue text against a black background? Blue is the hardest
color for our eyes to focus on and, personally, I do find it harder to read
blue text on black than, say, gray on black.

------
Railsify
The modal example was implemented horribly, you obviously need a border around
the dark mode modal. This is a failure in UX.

------
gnicholas
After Apple announced Dark Mode, I called up the dev who builds my startup's
iOS app. We already had some dark-mode-like features in the app, but with this
I was excited to make it global. Then he told me that if we want our iOS 13
users to be able to have a Dark Mode that is tied to the iOS 13 flag, users
who are on iOS 12 or earlier. This killed the idea for me — I don't want to
force people to upgrade from 12 to 13 (which has many bugs still), and I
certainly don't want to cause problems for people with devices that are not
supported by iOS 13.

I really wish Apple made it possible to give access to this feature without
cutting off a significant portion of iOS users (including pretty much all
schools, which are critical for us). Existing users can't upgrade, but new
purchasers wouldn't be able to download at all.

~~~
vedosity
I don't think this is true... Apps below iOS 13 won't be able to use the new
system-defined UIColors, yes, and users below iOS 13 can't change to the dark-
mode using a switch in the Control Center, yes.

But you've been able to change the "user interface style" for view controllers
since iOS 12 [0]. And you've been able to add UIColors to asset catalogs that
change depending on that setting since iOS 12 as well.

I'll be honest, I haven't tried this myself. But either this works or Apple's
documentation is wrong.

[0]:
[https://developer.apple.com/documentation/uikit/uiuserinterf...](https://developer.apple.com/documentation/uikit/uiuserinterfacestyle)

~~~
gnicholas
I sure hope you're right! It would seem pretty crazy to be forced to choose
between iOS 12-and-below and Dark Mode. Thanks for the pointer!

~~~
JoBrad
Depending on the target user for your app, you may see 90%+ on iOS 13 soon,
anyway.

------
notadoc
Let's be honest, dark mode is only necessitated by the whole flat design trend
which uses glaringly bright whites and stark interfaces.

The flat design trend is so tired, it never looked good, and it promotes bad
UX/UI. That has always been my opinion and it has grown only stronger as more
bandaids like 'dark mode' are slapped onto it.

~~~
kube-system
While I have always been skeptical of "flat" designs, I'm not so sure that
"dark mode" is a bandaid. I think it's something needed on its own, but flat
designs just happen to be caught up in the mix.

White-background designs are really just a hold-over from design approaches
developed for paper. Whereas white is a default color for paper, it never was
on CRTs, and isn't on OLED displays either. The design choice was mostly an
implicit (or habitual) emulation of paper.

There are both hardware and ocular reasons why dark backgrounds are
advantageous on screens, particularly mobile OLEDs. Power consumption, eye
fatigue, contrast, durability, etc. We need to make some of these changes
regardless of artistic design style.

~~~
Stratoscope
You may be right that dark modes are advantageous for some people, but please
don't assume that this is true for everyone.

In particular, dark modes may become more difficult as you get older. I'm 67
and I have a great deal of trouble reading text in a dark mode.

There is a physiological reason for this, and if you do any photography using
manual aperture control you may be familiar with it. Very high quality lenses
should be sharp whether the iris is wide open or stopped down. But mediocre
lenses have trouble wide open and give better sharpness stopped down to a more
narrow aperture.

As you get older, the lenses in your eyes are not as good as they were when
you were younger. There is a benefit in sharpness to have your irises stopped
down instead of wide open.

Light modes accomplish this. The background light naturally triggers your
irises to stop down, resulting in a sharper and more detailed view.

Dark modes encourage your irises to open wider, reducing your visual acuity.

Of course many people do enjoy dark modes, so there will never be a way to
please everyone! But please consider not making dark mode your only mode.

~~~
_emacsomancer_
I have the opposite experience: the older I get, the less tolerant of having
my eyes bathed in white light I become.

