bopuc/weblog

This is a normalized, cleaned up, new color palette for GlobalVoices. I had Jeremy quickly document our (ok ok my) crazy color use on the existing site and oh man what a mess. In my mad rush to add stuff over the last year, I strayed in my color choices. I have 4 different shades of dark blue going! Ayeee!

So I grabbed our three core colors, and twiddled to get 3 shades lighter and darker for each. Because I am picky, I made sure that
a) the hex values for the colors were "clean" (003399, vs 0134e9)
b) the steps between shades were all mathematically equivalent across the hues
Notice how the orange fades into giving us a bonus deep red and light yellow. For use on alerts and other more subtle attention grabbing needs in the UI.

The process was actually quite involved; the 2 median darker shades were culled from an 8 step gradation, the 2 lighter ones, from a 7 step one. Except for the orange which required a 5 step gradation which actually gave me 7 (no idea...). The grays are a 10 step from 333 to white. (I wanted to have the four "full" grays: 333, 666, 999, CCC, between 000-black and FFF-white.)

(The hexadecimal color values here are in shorthand: 039 expands to 003399, E6 expands to E6E6E6.)

Of course we will not necessarily use all these colors, but we have them on hand if we need, say, a lighter shade of something for a rollover effect, or a darker one for a header, etc...

Fun.

To dig deeper into the geekiness here... if I had followed the same process of hex number/letter shifting, the third color would be a sort of mauve. But I needed the orange. Hence the 039 -> 390 -> F60 sequence. Picking the C00 red for dark orange and the FFC pale yellow for the light orange was done by following patterns in a standard hex color map and plotting relative positions by eye... Worked out real well, me thinks!!