Aller au contenu

HEX · RGB · HSL · HSV · CMYK

Convertisseur de couleurs

La couleur #0060fd s’écrit rgb(0, 96, 253), hsl(217, 100%, 50%) et cmyk(100%, 62%, 0%, 1%). Saisissez n’importe quelle couleur CSS ou utilisez le sélecteur pour convertir la vôtre.

Les tuiles se mettent à jour au fil de la saisie. Si le texte n’est pas une couleur, une erreur s’affiche et la dernière couleur valide reste à l’écran.

Scanned by NortonTM Safe Web

En bref

Prix
Sans frais
Compte
Aucun requis
Envoi
Sans objet — vous saisissez une couleur, rien n’est envoyé
Entrée
HEX (3, 4, 6 ou 8 chiffres), rgb(), hsl(), hwb(), 148 noms de couleurs CSS et transparent
Sortie
HEX, RGB, HSL, HSV, CMYK et le nom de couleur CSS le plus proche
CMYK
Conversion mathématique, pas un profil d’impression

Couleurs courantes dans chaque modèle

Ces lignes ont été produites par le même code que le convertisseur. HSL, HSV et CMYK sont arrondis à des nombres entiers.

Une couleur dans six notations
SaisieHEXRGBHSLHSVCMYK
#0060fd#0060fdrgb(0, 96, 253)hsl(217, 100%, 50%)hsv(217, 100%, 99%)cmyk(100%, 62%, 0%, 1%)
red#ff0000rgb(255, 0, 0)hsl(0, 100%, 50%)hsv(0, 100%, 100%)cmyk(0%, 100%, 100%, 0%)
white#ffffffrgb(255, 255, 255)hsl(0, 0%, 100%)hsv(0, 0%, 100%)cmyk(0%, 0%, 0%, 0%)
black#000000rgb(0, 0, 0)hsl(0, 0%, 0%)hsv(0, 0%, 0%)cmyk(0%, 0%, 0%, 100%)
grey#808080rgb(128, 128, 128)hsl(0, 0%, 50%)hsv(0, 0%, 50%)cmyk(0%, 0%, 0%, 50%)
transparent#00000000rgba(0, 0, 0, 0)hsla(0, 0%, 0%, 0)hsv(0, 0%, 0%)cmyk(0%, 0%, 0%, 100%)

Comment convertir une couleur

1

Saisissez une couleur

Tapez un code HEX de 3, 4, 6 ou 8 chiffres, une valeur rgb(), hsl() ou hwb(), ou l’un des 148 noms de couleurs CSS. Vous pouvez aussi cliquer sur la case de couleur et choisir une couleur avec le sélecteur de votre navigateur.

2

Lisez les autres modèles

L’échantillon montre la couleur sur un damier, pour que la transparence soit visible. Les tuiles donnent la même couleur en HEX, RGB, HSL, HSV et CMYK, ainsi que le nom de couleur CSS le plus proche.

3

Copiez ce qu’il vous faut

Appuyez sur Copier sur une tuile pour placer cette valeur dans le presse-papiers, prête à être collée dans une feuille de style, un outil de design ou un document.

Comment les modèles de couleur sont liés

Le RGB décrit une couleur par les quantités de lumière rouge, verte et bleue qu’un écran additionne, chacune de 0 à 255 ; #0060fd correspond à 0 de rouge, 96 de vert et 253 de bleu. Le HEX est ces trois mêmes nombres écrits en base 16 : 96 devient 60 et 253 devient fd. Le HSL et le HSV décrivent la même couleur par un angle de teinte de 0 à 360 degrés sur le cercle chromatique, plus deux pourcentages : la saturation, et la luminosité (HSL) ou la valeur (HSV). #0060fd a une teinte de 217 dans les deux. Le CMYK décrit l’encre : le cyan, le magenta, le jaune et le noir sont soustraits du blanc du papier.

Le CMYK affiché ici est la conversion mathématique simple : le noir vaut 1 moins le plus grand des R, G et B, et le cyan, le magenta et le jaune sont ce qui reste. Ce n’est pas un profil d’impression : une imprimante ou un logiciel de design qui utilise des profils ICC donnera d’autres valeurs CMYK pour la même couleur. Les valeurs HSL sont affichées en nombres entiers, donc reconvertir une valeur arrondie peut décaler un canal de quelques unités : hsl(217, 100%, 50%) donne #0062ff, et non #0060fd. Le nom CSS le plus proche est le mot-clé dont l’écart de couleur CIE76 dans l’espace L*a*b* est le plus petit. Tout s’exécute dans votre navigateur et rien n’est envoyé.

Questions sur le convertisseur de couleurs

Comment convertir du HEX en RGB ?

Séparez les six chiffres en trois paires et lisez chaque paire comme un nombre en base 16. #0060fd donne 00, 60 et fd, soit 0, 96 et 253 : la couleur est donc rgb(0, 96, 253). Collez le code HEX dans le champ et la tuile RGB affiche le résultat.

Que signifient les deux derniers chiffres d’un code HEX à 8 chiffres ?

C’est le canal alpha, l’opacité, de 00 (totalement transparent) à ff (totalement opaque). #0060fd80 est le même bleu à 128 sur 255, soit environ 50.2% d’opacité, affiché sous la forme rgba(0, 96, 253, 0.502). Un code à 4 chiffres comme #06f8 fonctionne de la même façon, chaque chiffre étant doublé.

Quelle est la différence entre HSL et HSV ?

Les deux utilisent la teinte et la saturation, mais la troisième valeur diffère. En HSL, une luminosité de 50% donne la couleur pure, 0% le noir et 100% le blanc. En HSV, une valeur de 100% est la version la plus lumineuse de la couleur, et le blanc exige une saturation de 0%. Le même bleu est hsl(217, 100%, 50%) et hsv(217, 100%, 99%).

Puis-je utiliser le résultat CMYK pour l’impression ?

Utilisez-le seulement comme point de départ. Cette page applique la formule simple entre RGB et CMYK, qui ne sait rien des encres, du papier ni du profil d’une imprimante. Un imprimeur ou un logiciel de design avec profil colorimétrique convertira la même couleur RGB en valeurs CMYK différentes.

Quels formats de couleur puis-je saisir ?

Du HEX avec ou sans #, en 3, 4, 6 ou 8 chiffres ; rgb() et rgba() avec des virgules ou des espaces, des nombres ou des pourcentages, et un alpha facultatif après une barre oblique ; hsl(), hsla() et hwb() avec un angle en deg, rad, grad ou turn ; les 148 noms de couleurs CSS comme rebeccapurple ; et transparent.

Pourquoi le nom de couleur le plus proche n’est-il pas une correspondance exacte ?

CSS n’a que 148 noms de couleurs : la plupart des couleurs n’ont donc pas de nom propre. La page choisit le nom dont la couleur paraît la plus proche, mesurée par l’écart de couleur CIE76 dans l’espace L*a*b* ; pour #0060fd, c’est mediumslateblue. Quand la couleur est exactement celle d’un nom, comme #ff0000, la page indique qu’il s’agit d’une correspondance exacte.