Color Palette

Posted on
itpnyu comms visual language colorway

A color palette exercise with 5 tones.

  • light yellow: EFEBDF
  • midnight: 15212E
  • warm grey: 847C7C
  • red: 973A3A
  • blue: 3A6C97

Syntax Highlighting

My color choices were originally much different, but went through several iterations after trying to apply it to syntax highlighting.

I realized the changes were needed as I tried creating both “dark” and “light” syntax highlighting with the same limited palette. That required a dark background, a light background, and three mid tones.

The crosshatched design above helped me tweak the mid colors until they were legible on both the light and dark backgrounds.

In the below examples of syntax highlighting, the text colors are the same between both. Only the background color changes.

Maps

Maps are another common example of mapping color to information and significance.

Even these simple maps were a stretch for 5 colors. I had to remove elements in order to preserve a clear color mapping.

I finally tried restyling a logo to inspect how the colors impacted emotional response. The Google G icon was conveniently colorful.

Further Reading

In the end, my color palette ended reminding me of two references.

Solarized

Solarized is a color palette commonly used by programmers for text editors and terminal tools.

Solarized is where I got the idea to use the same colors on both dark and light variations.

Ethan Schoonover

W. E. B. Du Bois

W. E. B. Du Bois created a set of data visualizations around 1900 that have an aesthetic that are remarkably ahead of his time.

Library of Congress