Convertisseur de couleurs

Convertir les couleurs entre les formats HEX, RGB et HSL avec aperçu

Qu'est-ce que c'est et comment ça marche ?

Un convertisseur de couleur traduit une même couleur entre les formats du design et du code : HEX (#3B82F6), RGB (rgb(59, 130, 246)) et HSL (hsl(217, 91%, 60%)). Tous décrivent le même pixel, mais chacun est pratique à un endroit différent — HEX est compact et domine le CSS et les fichiers de design, RGB correspond directement à la façon dont les écrans mélangent la lumière rouge, verte et bleue, et HSL décrit la couleur comme on la pense : une teinte, son intensité, sa clarté. Convertir permet de porter proprement une couleur entre un outil de design, une feuille de styles et un logiciel graphique sans qu'elle dérive.

Les conversions sont des correspondances mathématiques exactes : #3B82F6, son triplet RGB et ses valeurs HSL sont trois écritures d'une même couleur. Le format le plus payant est HSL : comme il sépare la teinte de la luminosité, on bâtit une palette cohérente en gardant la teinte fixe et en ajustant seulement la luminosité pour les nuances, ce qui est malaisé à la main en HEX. Cet outil affiche les trois formats et un échantillon en direct à la fois, pour choisir la représentation qu'attend chaque outil et la copier aussitôt.

Cas d'usage

• Reproduire une couleur de marque : collez un HEX d'une charte et lisez ses valeurs RGB et HSL pour un outil qui n'en accepte qu'une.
• Créer des nuances pour une palette : partez d'une couleur de base en HSL et n'ajustez que la luminosité pour générer des variantes plus claires et plus sombres cohérentes.
• Traduire le design en code : convertissez la valeur RGB d'un designer en le HEX qu'attend un fichier CSS, avec un aperçu pour confirmer la bonne couleur.

Questions fréquentes

HEX, RGB et HSL décrivent-ils les mêmes couleurs ?

Oui. HEX et RGB sont la même information écrite autrement — chaque paire de chiffres HEX est un canal RGB. HSL est un autre système de coordonnées sur le même espace colorimétrique, donc toute couleur se convertit proprement entre les trois, sans perte pour les couleurs opaques standard.

Quand utiliser HSL plutôt que HEX ?

HSL brille quand on ajuste une couleur plutôt que de la nommer : éclaircir, assombrir ou désaturer. Garder teinte et saturation fixes et ne changer que la luminosité produit un ensemble harmonieux de nuances, bien plus dur à estimer à l'œil en HEX.

Comment gérer la transparence ?

La transparence est un canal alpha supplémentaire, écrit en HEX à 8 chiffres (#RRGGBBAA) ou en rgba()/hsla(). La conversion opaque couvre la couleur elle-même ; ajoutez la valeur alpha séparément pour les couleurs semi-transparentes.

Pourquoi ma couleur convertie paraît-elle un peu différente à l'écran ?

Les nombres sont exacts, mais l'apparence d'une couleur dépend de l'écran, de sa calibration et de son profil colorimétrique. La conversion ne change pas la couleur ; les écarts perçus viennent du moniteur qui restitue les mêmes valeurs différemment.

Développeur

Générateur UUID · Convertisseur de timestamp · Encodeur Base64 · Décodeur Base64 · Générateur de hash · Convertisseur de base numérique