Convertisseur de couleurs

Convertissez des couleurs entre HEX, RGB et HSL avec un aperçu en direct.

Chargement de l'outil…

Convertisseur de couleursSaisissez une couleur dans n'importe quelle notation — HEX, RGB ou HSL — et les autres formats se mettent à jour instantanément avec un grand échantillon en direct. Un sélecteur de couleur natif est inclus, et chaque valeur dispose d'un bouton de copie en un clic. Parfait pour faire correspondre les couleurs de marque entre CSS et outils de design.

Qu'est-ce que Convertisseur de couleurs ?

Color Converter est un convertisseur de couleurs HEX vers RGB vers HSL gratuit et en ligne, destiné aux développeurs et aux designers. Saisissez une couleur dans n'importe quelle notation — HEX (#rrggbb ou la forme abrégée #rgb), RGB (comme "255, 100, 0" ou "rgb(255 100 0)") ou HSL (comme "220, 91%, 64%") — et tous les autres formats se mettent à jour instantanément à côté d'un grand échantillon d'aperçu en direct. Un sélecteur de couleur natif vous permet de choisir une teinte visuellement, et chaque valeur dispose d'un bouton de copie en un clic, ce qui s'avère pratique chaque fois que vous devez faire correspondre des couleurs de marque ou convertir des valeurs de couleur CSS entre le code et les outils de design.

Comment utiliser Convertisseur de couleurs

  1. Saisissez ou collez une couleur dans le champ HEX, RGB ou HSL, ou cliquez sur l'échantillon du sélecteur de couleur pour choisir une teinte visuellement.
  2. Observez les deux autres champs et le grand échantillon d'aperçu se mettre à jour instantanément pour refléter la même couleur.
  3. Lisez les tuiles récapitulatives R / G / B, H / S / L et HEX ci-dessous pour connaître les valeurs de chaque canal converti.
  4. Cliquez sur le bouton de copie à côté d'un champ pour copier sa valeur : HEX copie la chaîne #rrggbb, tandis que RGB et HSL copient des chaînes rgb(...) et hsl(...) prêtes à l'emploi.
  5. Si une valeur est rejetée, vérifiez l'erreur en ligne et saisissez-la à nouveau dans le format indiqué par l'indice du champ.

Exemples

HEX vers RGB et HSL

Entrée

#ff6400

Sortie

RGB 255, 100, 0 / HSL 24, 100%, 50%

Expansion de la forme abrégée #rgb

Entrée

#fff

Sortie

HEX #ffffff / RGB 255, 255, 255 / HSL 0, 0%, 100%

Choisir une couleur visuellement

Cliquez sur l'échantillon pour ouvrir le sélecteur de couleur natif, faites glisser pour choisir n'importe quelle teinte, et les champs HEX, RGB et HSL se remplissent automatiquement avec les valeurs correspondantes.

Questions fréquentes

Quels formats de couleur ce convertisseur prend-il en charge ?
Il convertit entre trois formats : HEX (#rrggbb complet et la forme abrégée #rgb), RGB (0-255 par canal) et HSL (teinte en degrés, saturation et luminosité en pourcentage). Il ne gère pas actuellement l'alpha/opacité, le HSV, le CMYK ni les noms de couleurs CSS.
Pourquoi ma couleur affiche-t-elle une erreur "Invalid HEX color", "Invalid RGB color" ou "Invalid HSL color" ?
La valeur ne correspond pas au format attendu ou est hors plage. HEX doit comporter 3 ou 6 chiffres hexadécimaux, les canaux RGB doivent être compris entre 0-255, et la saturation et la luminosité HSL doivent être comprises entre 0-100%. Saisissez-la à nouveau en suivant l'indice sous ce champ.
Puis-je coller une valeur CSS complète comme rgb(255 100 0) ?
Oui. Les champs RGB et HSL extraient simplement les nombres du texte, donc "255, 100, 0" et "rgb(255 100 0)" fonctionnent tous les deux, et les boutons de copie produisent des chaînes rgb(...) et hsl(...) prêtes à l'emploi.
Les valeurs converties sont-elles arrondies ?
Oui. Les canaux RGB et les valeurs HSL sont arrondis à des nombres entiers, de sorte qu'une conversion aller-retour peut différer d'une unité de l'original. La sortie HEX comporte toujours deux chiffres par canal (#rrggbb).
Mes données de couleur sont-elles téléchargées quelque part ?
Non. Toute la conversion s'exécute localement dans votre navigateur avec JavaScript — rien n'est envoyé à un serveur et aucune valeur de couleur n'est téléchargée, donc cela fonctionne en toute confidentialité et même hors ligne une fois la page chargée.

Outils connexes