Collez un code couleur pour obtenir les formats HEX, RGB, HSL, HSV et HCV, ainsi que son niveau de lisibilité sous forme de texte.
Les WCAG 2 fixent à 4.5:1 le critère AA pour le corps de texte et 7:1 pour le AAA ; le texte de grande taille (18pt ou 14pt en gras) valide le niveau AA à 3:1. (Les WCAG sont les recommandations d'accessibilité web du W3C.) Le bleu #2457E6 est à environ 5.9:1 sur blanc, ce qui convient au corps de texte, mais à 3.6:1 sur noir, ce qui ne convient qu'aux grands textes.
Le format HSL sépare la teinte, la saturation et la luminosité : pour éclaircir ou assombrir une couleur, il suffit donc de modifier le L. L'échelle de luminosité ci-dessous en est l'illustration parfaite ; cliquez sur un palier pour le charger.
Le HSV (appelé HSB dans Photoshop et Figma) correspond à la teinte, la saturation et la valeur ; c'est le carré présent dans la plupart des sélecteurs de couleur. V est le canal le plus lumineux, S l'intensité de la couleur. Le HCV remplace la saturation par le chroma (C), l'écart entre le canal le plus clair et le plus sombre. #2457E6 correspond à hsv(224, 84%, 90%) et hcv(224, 76%, 90%). Aucun des deux n'est du CSS valide, utilisez donc HEX, RGB ou HSL dans votre code web.
#RGB, #RRGGBB, #RRGGBBAA, rgb()/rgba(), hsl()/hsla(), hsv()/hsb()/hcv(), un simple triplet comme '36, 87, 230', et une cinquantaine de noms de couleurs CSS courants.
Non. La conversion et les calculs de contraste s'exécutent dans votre navigateur.
#RRGGBBAA et rgba() sont pris en compte dans les résultats HEX et RGB. Le calcul du contraste ignore l'alpha et traite la couleur comme opaque.
Le CMJN pour l'impression dépend du profil colorimétrique, ce qui dépasse le cadre de cet outil.
Il convertit entre les formats HEX (y compris avec alpha), rgb(), hsl(), les triplets de nombres bruts et une cinquantaine de noms de couleurs CSS standards.
Oui, il calcule les ratios de contraste sur fond blanc, noir et personnalisé pour vérifier la conformité aux normes WCAG AA (4.5), AAA (7) et pour grand texte (3).
Oui, il affiche une échelle de luminosité à 9 paliers pour la teinte sélectionnée, et un clic sur une nuance charge instantanément ses valeurs.
Oui, vous pouvez choisir des couleurs visuellement à l'aide du sélecteur de couleur intégré, en plus de saisir directement les valeurs du code.