- Hex à HSL
- Étape 1: Convertir Hex en RVB
- Étape 2 : Normaliser les valeurs RVB
- Étape 3 : Trouver les valeurs RVB normalisées minimales et maximales
- Étape 4 : Calculer la teinte (H)
- Étape 5 : Calculer la légèreté (L)
- Étape 6 : Calculer la saturation (S)
- Étape 7: Ajuster la teinte (facultatif)
Hex à HSL
La conversion d’une couleur hexadécimale (hexadécimale) en HSL (teinte, saturation, luminosité) implique plusieurs étapes. Vous devez d’abord convertir la couleur hexadécimale en une valeur RVB. Vous pouvez ensuite convertir les valeurs RVB en HSL. Voici un guide étape par étape :
Étape 1: Convertir Hex en RVB
Pour convertir une couleur hexadécimale à 6 chiffres (par exemple, #RRGGBB) en une valeur RVB, divisez le code hexadécimal en trois paires de deux caractères chacune pour le rouge (RR), le vert (GG) et le bleu (BB). Convertissez ensuite chaque paire hexadécimale en décimale.
Par exemple, si vous avez la couleur hexadécimale #336699 :
R: 33 (hexadécimal) = 3 * 16 + 3 = 51 (décimal)
G : 66 (hexadécimal) = 6 * 16 + 6 = 102 (décimal)
B : 99 (hexadécimal) = 9 * 16 + 9 = 153 (décimal)
Ainsi, les valeurs RVB pour #336699 sont: R = 51, G = 102, B = 153.
Étape 2 : Normaliser les valeurs RVB
Normalisez les valeurs RVB pour qu’elles soient comprises entre 0 et 1 en divisant chaque valeur par 255 (valeur maximale pour un canal de couleur 8 bits).
R_norm = 51 / 255 ≈ 0,2
G_norm = 102 / 255 ≈ 0,4
B_norm = 153 / 255 ≈ 0,6
Étape 3 : Trouver les valeurs RVB normalisées minimales et maximales
Recherchez les valeurs minimales (min_RGB) et maximales (max_RGB) parmi les valeurs normalisées R, G et B.
min_RGB ≈ 0,2 (dans ce cas, R_norm est le plus petit)
max_RGB ≈ 0,6 (dans ce cas, B_norm est le plus grand)
Étape 4 : Calculer la teinte (H)
La valeur de teinte (H) représente la couleur elle-même et est calculée en fonction des proportions relatives des couches RVB. Il est exprimé sous la forme d’un angle en degrés (0° à 360°). La formule pour calculer H est la suivante :
H = 60 * ( (G_norm - B_norm) / (max_RGB - min_RGB) ) mod 360
Dans ce cas, H ≈ 60 * ((0,4 - 0,2) / (0,6 - 0,2)) ≈ 60 * (0,2 / 0,4) ≈ 60 * 0,5 ≈ 30°
Étape 5 : Calculer la légèreté (L)
La valeur de luminosité (L) représente la luminosité de la couleur et est calculée comme la moyenne des max_RGB et des min_RGB :
L = (max_RGB + min_RGB) / 2 ≈ (0,6 + 0,2) / 2 ≈ 0,4
Étape 6 : Calculer la saturation (S)
La valeur de saturation (S) représente l’intensité de la couleur et est calculée en fonction de la luminosité et des valeurs RVB maximales et minimales :
S = (max_RGB - min_RGB) / (1 - |2 * L - 1|)
S = (0,6 - 0,2) / (1 - |2 * 0,4 - 1|) ≈ 0,4 / 0,2 ≈ 2
Étape 7: Ajuster la teinte (facultatif)
Parfois, la teinte calculée peut être négative ou supérieure à 360°. Si tel est le cas, ajustez la teinte comme suit :
Si H < 0, alors H = H + 360°
Si H > 360°, alors H = H - 360°
Dans ce cas, H = 30° (aucun réglage nécessaire)
Ainsi, la représentation HSL de la couleur #336699 est approximativement: H = 30 °, S = 2, L = 0,4. Notez que les valeurs HSL sont souvent exprimées avec H comme angle et S et L comme pourcentages, de sorte que la représentation finale peut être donnée comme HSL (30°, 200%, 40%).