Convertisseur et Sélecteur de Couleurs

HEX#6366f1
RGBrgb(99, 102, 241)
RGBArgba(99, 102, 241, 1)
HSLhsl(239, 84%, 67%)
HSLAhsla(239, 84%, 67%, 1)
HSVhsv(239, 59%, 95%)
OKLCHoklch(0.5854 0.2041 277.12)

Palette de couleurs

Complémentaire
Analogues
Triadiques

Vérificateur de contraste (WCAG)

Texte d’exemple
17.74rapport de contraste
Normal AA
Normal AAA
Grand AA
Grand AAA

Qu'est-ce qu'un convertisseur de couleurs ?

Le Convertisseur de Couleurs est une boîte à outils complète pour les designers et développeurs front-end. Collez une couleur dans n’importe quel format courant — HEX, RGB, RGBA, HSL, HSLA, HSV/HSB ou le moderne OKLCH — ou choisissez-la visuellement, et tous les autres formats se mettent à jour instantanément avec un bouton de copie. Au-delà de la conversion, il génère une palette harmonieuse (couleurs complémentaires, analogues et triadiques) à partir de votre couleur de base et inclut un vérificateur de contraste WCAG pour garantir que le texte reste accessible sur n’importe quel fond. Tout s’exécute dans votre navigateur : rapide, privé et toujours disponible.

Les couleurs sur les écrans sont définies par des nombres, mais ces nombres peuvent s'écrire dans plusieurs formats — HEX (#ff6b35), RGB (255, 107, 53), HSL (18°, 100%, 60%) et d'autres. Chaque format est préféré dans un contexte différent.

Conversion de Couleurs

  1. Utilisez le sélecteur de couleur ou saisissez une valeur (ex. #6366f1 ou rgb(99,102,241)).
  2. Lisez chaque format dans la liste et copiez-en un avec son bouton de copie.
  3. Explorez la palette générée et testez le texte sur un fond avec le vérificateur de contraste.

Applications

  • Convertir une couleur de marque de HEX (fournie par un designer) en HSL pour ajuster la luminosité ou la saturation en CSS.
  • Traduire une valeur RGB d'un outil graphique en chaîne HEX prête pour le CSS.
  • Vérifier visuellement un code couleur en passant d'un format à l'autre pour le code.
  • Apprendre la théorie des couleurs en voyant comment la même couleur est représentée dans différents modèles.

Comment fonctionne la conversion de couleurs

HEX est simplement RGB écrit en base 16 : #ff6b35 signifie R=255, G=107, B=53. Convertir HEX en RGB est un décodage de base 16 vers base 10. Convertir RGB en HSL suit une formule.

L'outil affiche un aperçu en direct de la couleur pour confirmer la conversion d'un coup d'oeil.

Avantages

  • Convertissez instantanément entre HEX, RGB, HSL, HSV et OKLCH sans retenir de formules.
  • Créez des interfaces accessibles en vérifiant le contraste WCAG AA/AAA pour le texte normal et grand.
  • Générez des palettes complémentaires, analogues et triadiques pour accélérer votre travail de design.

Conversion de Couleur Instantanée et Locale

Les conversions de format de couleur sont calculées à l'aide d'algorithmes JavaScript dans votre navigateur. Les valeurs de couleur que vous entrez ne sont jamais transmises à nos serveurs; toute la conversion reste sur votre machine.

FAQ

Quels formats de couleur sont pris en charge ?

HEX, RGB, RGBA, HSL, HSLA, HSV/HSB et OKLCH. Collez l’un d’eux ou utilisez le sélecteur visuel, et tous les autres se mettent à jour instantanément.

Qu’est-ce qu’OKLCH ?

OKLCH est un espace colorimétrique moderne et perceptuellement uniforme pris en charge par CSS. Il rend les ajustements de luminosité et de chroma plus naturels que le HSL.

Comment fonctionne le vérificateur de contraste ?

Il calcule le rapport de contraste WCAG entre deux couleurs et indique si elles passent AA et AAA pour le texte normal et grand.

Quelle est la différence entre HSL et HSB/HSV ?

En HSL, 100% de luminosité est toujours blanc et 0% toujours noir ; en HSB, 100% de luminosité avec 100% de saturation donne la teinte pure. Le CSS utilise HSL ; Photoshop utilise HSB.