En quoi HSL diffère-t-il de HSV ?

Les deux utilisent la teinte (0 à 360°) et la saturation, mais la troisième valeur diffère : HSL utilise la luminosité (lightness) et HSV la valeur (luminosité maximale). Les mêmes nombres donnent donc des couleurs différentes.

La valeur CMYK convient-elle pour l'impression ?

Ce n'est qu'une conversion approximative à partir du RGB. Pour une impression professionnelle, utilisez le profil colorimétrique indiqué par votre imprimeur.

Que signifie un code HEX à 8 chiffres ?

Les deux derniers chiffres définissent l'opacité (alpha) : 00 correspond à une transparence totale et ff à une opacité totale.

Pourquoi les nombres diffèrent-ils légèrement de ceux d'autres outils ?

Les valeurs sont arrondies à l'entier : des conversions aller-retour via HSL ou CMYK peuvent donc décaler un canal de 1.

Convertisseur de couleurs : HEX, RGB, HSL, HSV, CMYK

Convertissez des couleurs entre HEX, RGB, HSL, HSV et CMYK, vérifiez le contraste et composez une palette.

Sélecteur de couleur

Opacité (alpha): 1

HEX

RGB / RGBA

HSL / HSLA

HSV

CMYK

CSS

color: #2563eb;
color: rgb(37, 99, 235);
color: hsl(221, 83%, 53%);

Contraste WCAG

Calculé avec la couleur opaque comme couleur du texte.

Aa sur blanc

Rapport: 5.17:1

Texte AA: Réussi
Grand texte AA: Réussi
Texte AAA: Échec
Grand texte AAA: Réussi

Aa sur noir

Rapport: 4.06:1

Texte AA: Échec
Grand texte AA: Réussi
Texte AAA: Échec
Grand texte AAA: Échec

Palette

Cliquez sur une pastille pour la sélectionner.

Nuances plus claires et plus foncées

Couleur complémentaire

Couleurs analogues

Mode d'emploi

Choisissez une couleur avec le sélecteur ou saisissez-la dans n'importe quel champ : tous les autres formats se mettent à jour instantanément. Les codes HEX de 3, 4, 6 ou 8 chiffres (par exemple #f80 ou #ff880080) sont acceptés, tout comme les notations rgb(), rgba(), hsl(), hsla(), hsv() et cmyk(). Le curseur règle l'opacité (alpha).

Le bouton à côté de chaque champ copie sa valeur, et la section CSS vous fournit des lignes color: prêtes à l'emploi.

Contraste et accessibilité

L'outil calcule le rapport de contraste WCAG entre la couleur choisie et le blanc, puis le noir. Pour du texte normal, le niveau AA exige au moins 4,5:1 et le niveau AAA 7:1. Pour du texte de grande taille (environ 24 px, ou 19 px en gras), il faut respectivement 3:1 et 4,5:1.

Le contraste est calculé sans transparence, c'est-à-dire avec la couleur entièrement opaque.

Palette, CMYK et confidentialité

La palette présente des nuances plus claires et plus foncées (mélangées avec du blanc ou du noir), la couleur complémentaire (opposée sur le cercle chromatique) et les couleurs voisines. Cliquez sur une pastille pour en faire la couleur courante.

Le CMYK est calculé ici avec une formule mathématique simple : le rendu imprimé peut donc différer, car des couleurs d'impression précises dépendent de l'imprimante et du profil colorimétrique. Tous les calculs s'effectuent dans votre navigateur et aucune donnée n'est envoyée.