Monday, March 25, 2019

Picking the Perfect Colour Combination for a Text Editor

Programmers (and technical writers too) can be very fussy about the colour and font choices they use in their editing tools. I cannot stand editing code in an editor that uses a white background; I always set my background colour to dark blue or black and use brightly colours for syntax highlighting. (I have trouble with low contrast text). However, every has their own preferences, and it seems that many people like the Solarized themes that have appeared in the last few years.

Most of those owe their existence to designer and programmer, Ethan Schoonover, who developed the set of colours in 2010, as described in this Wired article.
"I didn't release it until I was 1,000 percent sure I loved all the colors and they were all dialed in mathematically," Schoonover says. "I had multiple monitors, some were color calibrated, others were deliberately messed up. Sometimes I showed my wife, who thought I was a little nuts."
The article goes into some of the design and colour theory behind his choice of colours. I found it quite fascinating.
The optimal amount of contrast for text on a screen is controversial; many people prefer high-contrast themes. But contrast wasn't Schoonover's only concern. He found most low-contrast color schemes lacking as well. Even the best-designed themes tended to use at least one color that appeared distractingly brighter than others. That's because the apparent brightness of a color varies depending on its background. In other words, a specific shade of blue will appear more or less bright, depending on the surrounding colors.
This phenomenon, known as the Helmholtz–Kohlrausch effect, is particularly aggravating for programmers because coding tools use color to distinguish different parts of code. In the code for a web page in a typical text editor using the Solarized Dark theme, for example, web links appear in green; the syntax for formatting, such as adding italics, is blue, and comments that developers write for themselves are gray. Ideally, the colors should help tell these elements apart, but no single element should stand out more than others.

No comments: