Skip to main content
UtilityStack

Convertisseur de couleurs — HEX, RGB, HSL, HSV

Saisissez ou choisissez une couleur pour voir instantanément ses représentations HEX, RGB, HSL et HSV. La conversion est calculée localement dans votre navigateur — rien n'est envoyé.

HEX
RGB
HSL
HSV

Pourquoi convertir entre espaces de couleur ?

Chaque espace de couleur a son usage. HEX est compact et universellement supporté en CSS et dans les outils de design. RGB est l'espace natif de tout écran et le format attendu par de nombreuses API. HSL (teinte, saturation, luminosité) et HSV (teinte, saturation, valeur) sont conçus pour les humains — ils permettent de raisonner facilement sur la luminosité ou la saturation d'une couleur, ce qui est beaucoup moins intuitif en HEX ou RGB.

Lors de la conception d'une interface, on commence souvent en HSL pour dériver une palette cohérente (même teinte, luminosité variable pour les nuances), puis on exporte les valeurs finales en HEX pour le code. Ce convertisseur permet de passer librement entre les quatre représentations sans perdre en précision.

Comment utiliser cet outil

  1. Saisissez n'importe quelle couleur dans le champ d'entrée — HEX (#3b82f6 ou #38f), rgb(), rgba(), hsl(), hsla() ou hsv() sont tous acceptés.
  2. Ou utilisez le sélecteur de couleurs natif à gauche pour la choisir visuellement.
  3. Cliquez sur « Aléatoire » pour générer une couleur au hasard et voir toutes ses représentations d'un coup.
  4. Copiez l'un des quatre formats de sortie avec le bouton Copier à côté.

Questions fréquentes

Quels formats d'entrée sont reconnus ?

Hexadécimal (3, 6 ou 8 chiffres, préfixe # optionnel), rgb()/rgba(), hsl()/hsla() avec ou sans le signe pourcent, et hsv(). Le canal alpha est analysé mais n'est pas affiché dans les sorties converties pour le moment.

Quelle est la différence entre HSL et HSV ?

Tous deux expriment la couleur en Teinte / Saturation / autre. Le troisième composant diffère : en HSL c'est la Luminosité (0 % noir, 50 % couleur pure, 100 % blanc), en HSV c'est la Valeur (0 % noir, 100 % couleur pure). HSL est symétrique autour de 50 %, HSV est plus proche du comportement d'un mélange de peinture.

Pourquoi ma couleur convertie semble-t-elle légèrement différente ?

Les conversions entre RGB arrondi en entiers et HSL/HSV arrondi en pourcent ne sont pas parfaitement réversibles. Pour la plupart des travaux d'interface, la différence est invisible, mais si vous avez besoin d'un aller-retour exact, traitez HEX/RGB comme la source de vérité et recalculez HSL/HSV à partir de là.

Les noms de couleurs comme « red » ou « tomato » sont-ils supportés ?

Pas encore. Les couleurs nommées CSS ajoutent environ 150 mappings faciles à supporter — nous les ajouterons dans une future mise à jour. En attendant, vous pouvez coller l'équivalent HEX.

Le canal alpha est-il supporté ?

Il est analysé (l'entrée rgba/hsla est acceptée) mais seule la partie RGB est convertie. Une conversion alpha complète sur les quatre espaces est dans la feuille de route.

Outils similaires