Scale for web colors

Question

I'm using google map to display historical events and would like to color the markers based on the decade an event occurs. The event are between 1800 and 2000 (so about 20 different decades). I'd like to scale scale from yellow to orange to red. Any ideas?

tldr = want to scale from yellow to red in 20 steps in web rgb

EDIT: dudes - this is what i'm doing after reading this: How to get hex color value rather than RGB value?

http://jsfiddle.net/p6ek6/3/

score 1 · Accepted Answer · answered Jan 04 '12 at 21:57

1

Use HSL instead, since you can simply adjust the first parameter H for the color. Something around 0 to 50 should give you a nice red-yellow gradient.

Red example: hsl(0, 100, 50%);

Yellow example: hsl(50, 100, 50%);

answered Jan 04 '12 at 21:57

Nate B

6,338
25
23

this answer is most like what i ended up doing. code is avail in a jsfiddle in the edit to my question – Andrew Samuelsen Jan 04 '12 at 22:38

score 0 · Answer 2 · answered Jan 04 '12 at 22:00

This is 100% subjective. There is no scale.

Your best bet is to copy color schemes from other professionally produced maps or find color scheme inspiration elsewhere.

I suggest using National Geographic or just go out in nature to get inspired about color schemes.

In your situation, try to think about all the colors you see during fall with leaves falling off trees.

I hope you don't have to print this on a color printer, or this gets even more complicated.

Scale for web colors

2 Answers2