Voilà un ensemble de fonctions JScript qui permettent de convertir les couleurs du format RGB au format HSL et inversement. En effet, si vous voulez eclaircir une couleur, il faut être au format HSL (Hue, Saturation and Luminance) qui est le format pour les humains alors que le codage HTML standard est RGB (#RRGGBB ou RR, GG et BB sont les codages des trois couleurs) est le langage machine.
// JScript source code
//Red : 0..255
//Green : 0..255
//Blue : 0..255
//Hue : 0,0..360,0<=>0..255
//Lum : 0,0..1,0<=>0..255
//Sat : 0,0..1,0<=>0..255 //Retourne un tableau de 3 valeurs : H,S,L
function RGB2HSL (r, g, b)
{
red = Math.round (r);
green = Math.round (g);
blue = Math.round (b);
var minval = Math.min (red, Math.min (green, blue));
var maxval = Math.max (red, Math.max (green, blue));
var mdiff = maxval – minval + 0.0;
var msum = maxval + minval + 0.0;
var luminance = msum / 510.0;
var saturation;
var hue;
if (maxval == minval)
{
saturation = 0.0;
hue = 0.0;
}
else
{
var rnorm = (maxval – red) / mdiff;
var gnorm = (maxval – green) / mdiff;
var bnorm = (maxval – blue) / mdiff;
saturation = (luminance <= 0.5) ? (mdiff / msum) : (mdiff / (510.0 – msum));
if (red == maxval)
hue = 60.0 * (6.0 + bnorm – gnorm);
if (green == maxval)
hue = 60.0 * (2.0 + rnorm – bnorm);
if (blue == maxval)
hue = 60.0 * (4.0 + gnorm – rnorm);
if (hue > 360.0)
hue -= 360.0;
}
return new Array (Math.round (hue * 255.0 / 360.0), Math.round (saturation * 255.0), Math.round (luminance * 255.0));
}
function Magic (rm1, rm2, rh)
{
var retval = rm1;
if (rh > 360.0)
rh -= 360.0;
if (rh < 0.0)
rh += 360.0;
if (rh < 60.0)
retval = rm1 + (rm2 – rm1) * rh / 60.0;
else if (rh < 180.0)
retval = rm2;
else if (rh < 240.0)
retval = rm1 + (rm2 – rm1) * (240.0 – rh) / 60.0;
return Math.round (retval * 255);
}
//Retourne un tableau de 3 valeurs : R,G,B
function HSL2RGB (h, s, l)
{
var hue = h * 360.0 / 255.0;
var saturation = s / 255.0;
var luminance = l / 255.0;
var red;
var green;
var blue;
if (saturation == 0.0)
{
red = green = blue = Math.round (luminance * 255.0);
}
else
{
var rm1;
var rm2;
if (luminance <= 0.5)
rm2 = luminance + luminance * saturation;
else
rm2 = luminance + saturation – luminance * saturation;
rm1 = 2.0 * luminance – rm2;
red = Magic (rm1, rm2, hue + 120.0);
green = Magic (rm1, rm2, hue);
blue = Magic (rm1, rm2, hue – 120.0);
}
return new Array (red, green, blue);
}
La procédure est la suivante :
- conversion RGB vers HSL,
- changement de la luminance
- conversion HSL vers RGB
Ci joint, un exemple en ASP
Function FormatColorClaire(color,ratio)
if len(color)=7 then
color = right(color,6)
end if
‘on passe en RGB
R = CInt(« &H » & left(color,2))
V = CInt(« &H » & mid(color,3,2))
B = CInt(« &H » & right(color,2))
‘on passe en HSL
tab = split(RGB2HSL (R, V, B), », »)
‘on change la luminosité
‘on repasse en RGB
tab2 = split(HSL2RGB (tab(0),tab(1), ratio), », »)
‘puis on recode en hexa
R = Format_double(hex(tab2(0)), 2, « 0 »)
V = Format_double(hex(tab2(1)), 2, « 0 »)
B = Format_double(hex(tab2(2)), 2, « 0 »)
‘response.write R & » » & V & » » & B
FormatColorClaire = « # » & R & V & B
End Function
Quelques liens :
http://www.easyrgb.com/math.php?MATH=M19 pour les formules mathématiques de conversion entre beaucoup de formats
D’autres fonctions en C# et VB : http://www.bobpowell.net/RGBHSB.htm
Et bien sûr Google :
http://www.google.fr/search?sourceid=navclient&hl=fr&ie=UTF-8&rls=GGLI,GGLI:2005-25,GGLI:fr&q=HSL+to+RGB
