An IDE theme is the group of colors that represent all elements in your editor. There are a lot of themes available in online marketplaces, you can even make your own! In this post, we’ll craft the best possible theme. We’ll only focus on eye strain and contrast (and maybe user’s feelings?). Not on ✨ aesthetics ✨

Ok, so we know that bright colors really affect eye-strain after a long period of time¹ in a dark room. These colors, mixed with high contrasts can amplify that effect². In short, not having a 100% contrast between font color and background color is “beneficial” (not as bad) to our eyes. (Very bad, very high contrast | A bit better, less contrast)

If you’ve taken any design class, you probably know this. It’s very basic and one of the first things web designers learn. But lowering contrast isn’t always good. Higher contrast helps visual identification performance³ (⁴) and may feel better under brighter settings (sunlight on the screen, etc…).

Very low contrast isn’t an option neither.

What about dark modes / themes?

You may be thinking about dark modes, where the text is brighter than the background. They are better than the alternative; although, the way our screens work (having a white)

As a tangent, for power users (our target, programmers in this case), dark modes tend to be the norm. For normal users, they tend to be put of by the “negative text” ⁵.

At the end, it isn’t much better, as a lot of screens are back-lit; they have a white “square of light behind the pixels” so it lights the screen. So eye strain is practically the same (as well as long-term eye damage) and-

WAIT, long-term eye damage?

Yep, turns out your parents were right about this. Exposure to blue light (400 - 500 nm) (Not only blue light, but any short-wavelength light) can be harmful to the retina. Peak damage being around 440 nm⁶, See Figure 1.

Note that longer duration ($12 - 48$) even with a lower intensity can also cause photochemical damage⁷, being cones (the color ones) the most affected.

But don’t worry, it seems like it doesn’t represent a cause for concern for public health. Comparing natural exposures with the reasonably foreseeable exposure to optical radiation from lamps, computer screens and mobile devices, such as smartphones shows that the actual spectrally weighted irradiance is lower than the natural exposures.⁸

Does this mean you can be dumb with your eyes? No. Rant over.

Ok, what about colors

As you probably know, humans don’t see all colors with the same intensity. Although we have from L:M (red to green cones proportions) of about $1.1:1$ to $16.5:1$ ($52.7%$ - $94.3%$) in males⁹, we are actually a bit more perceptive to green (natural selection reasons). So, we should take this into account and make some calculations for balancing colors.

As we saw, $440 nm$ is the most damaging wavelength in LED screens. So we’ll use wavelengths shown on Figure 1 that have less than a $0.3$ in the Intensity scale.

So, we’ll pick $420nm$ and $500nm$ (just some arbitrary values). If we do some math (that, admittedly may be wrong) we get that $420nm$ is this cool shade of purple and $500nm$ is this shade of green.

There’s a good thing here: Those are almost complementary colors. A complementary color is one that its opposite to another one in the color wheel. Orange and purple, green and red…

So, by being almost complementary, we already cover our requirement of having kinda low contrast But, you’re probably thinking that those colors are too bright, so we’re going to lower their brightness in an equal way.

We’ll use this tone, waaay better.

Final touches.

So, we have our colors. Yay :D We can now put them to good use!

via GIPHY

I can’t believe it actually looks kinda good… Maybe I should adopt it as the official theme for this blog…

I really thought it would hurt my eyes even more. Maybe using science to craft things does work after all!

Conclusion

Talking about eyes for so long makes my ocular globes feel weird… Ok, this was pretty fun to research, but note that I’m not even close to being an Ophthalmologist. Although I tried to provide as many references as I could, take this with a whole NaCl rock.

Also, did you know that I’m very scared by eyes? Like, a genuine phobia? Just a fun fact. Making this was pretty fun 💀 _{I think it all started when I was very young…}