Fade in hex colour based on a scale

How do you fade in a hex colour? based on a scale of 0 - 100.

Say I want an element to be green when awarded 100, and white when 0, with all the shades in between.

Update: HEX>RGB>HSV - Helpful collection of routines here: http://php.amnuts.com/index.php?do=vie开发者_JAVA百科w&id=16&file=class.image.php

You should use the HSV colour coordinates, and let the hue (H) and value (V) be fixed, and vary the saturation (S) from none (gray, 0) to full (green, 1). It is easy to convert between RGB and HSV. You can use the formulae from Wikipedia.

Well, because screen colors are "light" and not "pigments" the absence of all color is black, not white. So it would be mush easier to go from black to green with CSS rgb colors, not hex.

rgb(0,0,0) --> rgb(0,255,0)

To do the same for white you would need to start with all colors, and remove blue and red on a scale to leave pure green.

rgb(255,255,255) --> rgb(150,255,150) --> rgb(0,255,0)

And then just do the math for a number to multiply by your scale ( 255/100 = 2.55 ) SO

If i score 75.

75 * 2.55 = 191 (rounded)

So on the white to green I would set my color to

element.class {color:rgb(191,255,191); }

The easiest way would be to use rgb() in CSS. Since it accepts raw integers, you can simply alter the numbers for the r and b values from 0 (with g being 255) for epic green, to 255, which is white.