Recherche de couleurs CSS nommées | Dictionnaire bidirectionnel des 148 mots-clés couleur CSS
Dictionnaire pour développeurs qui couvre les 148 couleurs nommées définies dans le CSS Color Module Level 4. Cherchez par nom pour obtenir les notations hex / RGB / HSL / OKLCH, ou collez n'importe quel hex pour obtenir le mot-clé CSS perceptuellement le plus proche, classé par distance ΔE OKLab. De quoi décider sur place si une couleur du design system peut s'écrire avec un mot-clé CSS standard ou doit rester en hex personnalisé.
💡 À propos de cet outil
Les 148 couleurs nommées CSS (steelblue, cornflowerblue, lightgoldenrodyellow et compagnie) forment un vocabulaire figé hérité du fichier rgb.txt de X Window System, intégré à SVG 1.0 puis standardisé dans le CSS Color Module. La plupart des développeurs s'en remettent à l'autocomplétion de leur éditeur, ce qui coince sur des noms longs comme lightgoldenrodyellow ou mediumspringgreen, et ouvrir MDN à chaque fois casse le flux de travail.
Le champ de saisie offre ici une autocomplétion native : taper light propose immédiatement lightcoral, lightskyblue et leurs voisins, et la sélection remplit en parallèle les notations hex, RGB, HSL et oklch(). Dans l'autre sens, collez un hex quelconque et l'outil calcule le mot-clé CSS le plus proche perceptuellement, en utilisant les coefficients OKLab de Björn Ottosson. La distance ΔE OKLab reflète bien mieux la perception humaine que la distance euclidienne sRGB, donc la suggestion « couleur la plus proche » correspond à ce que voit votre œil — pratique pour décider si #5e8aaf est assez proche de steelblue pour livrer le mot-clé.
🧐 Questions fréquentes
Q. Combien y a-t-il de couleurs nommées CSS ?
A. 148, formellement définies dans le CSS Color Module Level 4 (section 6.1). En comptant séparément les variantes orthographiques gray/grey, on monte à 157 entrées de surface, mais la palette sRGB sous-jacente reste de 148 valeurs distinctes.
Q. Pourquoi rebeccapurple (#663399) existe-t-il ?
A. Le CSS Working Group l'a ajouté en 2014 en mémoire de Rebecca Meyer, fille de l'auteur de CSS Eric Meyer. C'est l'une des rares couleurs dont la spécification documente explicitement l'histoire humaine.
Q. gray et grey désignent-ils la même couleur ?
A. Oui. Neuf mots-clés de la famille des gris (gray, darkgray, lightgray, dimgray, slategray, lightslategray, darkslategray et formes composées) ont des alias en grey qui partagent exactement la même valeur hex, conservés pour raisons historiques.
Q. Pourquoi utiliser ΔE OKLab pour la recherche du nom le plus proche ? A. La distance euclidienne en sRGB s'écarte beaucoup de la perception humaine, surtout dans les zones sombres et saturées : deux couleurs équidistantes en RGB peuvent paraître identiques ou très différentes. OKLab, publié par Björn Ottosson en 2020, est un espace de couleur perceptuellement uniforme où la distance en ligne droite approxime la différence perçue.
Q. Peut-on saisir directement du RGB, du HSL ou de l'OKLCH ? A. Non, pas pour le moment. Les modes d'entrée n'acceptent que les noms CSS et les codes hex. RGB, HSL et OKLCH sont uniquement en sortie ; convertissez d'abord vos valeurs en hex.
Q. La notation oklch() est-elle utilisable en CSS ?
A. Oui. oklch(L% C H) fait partie du CSS Color Module Level 4 et est disponible dans les versions actuelles de Chrome, Safari et Firefox. Son adoption croît dans les design systems à gamut étendu (Display P3 ou Rec.2020).
📚 Le saviez-vous
La liste des couleurs nommées CSS remonte au fichier rgb.txt livré avec X Window System au milieu des années 1980, où chercheurs et programmeurs graphiques attribuaient les noms à la main. Des noms fantaisistes comme mediumaquamarine, papayawhip ou peachpuff sont des fossiles de cette époque, la sensibilité d'un auteur de thème X11 oublié, désormais figée dans la plateforme web parce que le CSS Working Group a choisi de préserver, plutôt que d'élaguer, l'ensemble historique.
Voir le vocabulaire textile des années 1980 (burlywood = couleur d'écorce dépouillée, gainsboro = nom d'un peintre anglais du XVIIIᵉ siècle) cohabiter dans la même spécification que la notation moderne oklch() fait de la section couleur de CSS l'un des rares documents de la plateforme web qui couvre quarante ans d'histoire de l'informatique en deux cents lignes.