AbraCalc

Convertisseur de Couleur Hex en HSL

Convertissez un code couleur hex CSS en HSL (teinte, saturation, luminosité) en un clic.

Intégrer cet outil sur votre site
Citer cet outil

APA

AbraCalc. (2026). Convertisseur de Couleur Hex en HSL [Online calculator]. Retrieved from https://abracalc.com/fr/hex-en-hsl/

BibTeX

@misc{abracalc-hex-en-hsl, author = {AbraCalc}, title = {Convertisseur de Couleur Hex en HSL}, year = {2026}, howpublished = {\url{https://abracalc.com/fr/hex-en-hsl/}} }

Cet outil a-t-il répondu à votre question ?

Comment utiliser cet outil

  1. Entrez un code couleur hex à 6 chiffres (par ex. #ff5733). Le # initial est facultatif.
  2. L'outil le convertit en HSL : teinte en degrés, saturation et luminosité en pourcentages.
  3. Copiez la chaîne hsl() dans votre CSS ou feuille de style.

Collez un code couleur hex et obtenez la valeur HSL équivalente pour les fonctions CSS hsl() ou les outils de design.

Formule

Expand a 3-digit hex to 6 digits if needed (e.g. #abc#aabbcc), then parse each pair: r = parseInt(hex[0..1], 16) / 255, similarly for g and b.

Then apply RGB-to-HSL: L = (max + min) / 2; S = d / (2 − max − min) if L > 0.5, else S = d / (max + min); hue from the dominant channel as in RGB-to-HSL.

Questions fréquentes

Pourquoi convertir le hex en HSL ?
HSL est plus facile à manipuler pour ajuster la luminosité ou la saturation. Vous pouvez garder la teinte fixe et ajuster la saturation/luminosité pour créer des teintes claires et foncées.
Cela prend-il en charge le hex à 3 chiffres ?
Oui — #abc est traité comme #aabbcc.

Références et sources