Couleurs CSS nommées

Que sont les couleurs CSS nommées ?

Les couleurs CSS nommées sont un ensemble fixe de 147 mots-clés — comme tomato, aliceblue, rebeccapurple — utilisables partout où une couleur CSS est attendue, à la place d'un code hex ou d'une fonction rgb(). Elles sont intégrées à tous les navigateurs, s'affichent à l'identique sur toutes les plateformes et ne nécessitent aucun prétraitement. La liste a grandi au fil de l'histoire de CSS : les 16 premières viennent du VGA, un autre lot de X11, et rebeccapurple a été ajoutée en 2014 en mémoire de la fille du pionnier de CSS Eric Meyer.

Comment utiliser cette référence

Tapez dans le champ de recherche pour filtrer par nom (essayez blue, dark ou red) ou par hex (essayez ff). Changez le tri pour organiser par teinte si vous cherchez une couleur précise que vous ne savez décrire que visuellement, ou par luminosité quand vous choisissez des nuances pour des états de hover. Cliquez sur une pastille pour copier le mot-clé dans votre presse-papiers — collez-le directement dans une règle CSS comme color: tomato;.

Quand utiliser les couleurs nommées

Les couleurs nommées sont parfaites pour les prototypes rapides, les badges README, le code de démonstration et tout contexte où une fidélité absolue à la marque n'est pas requise. Elles ne sont pas idéales pour les design systems de production — la palette héritée est inégale (beaucoup de roses et d'oranges, peu de turquoises sombres) et les noms sont étranges (papayawhip, peachpuff). Pour du code en production, dérivez les équivalents hex des couleurs nommées et reconstruisez la palette autour de votre marque avec un outil comme notre Générateur d'harmonie de couleurs.

D'où viennent les noms

Les 147 noms remontent au fichier rgb.txt du X Window System de la fin des années 1980, qui empruntait lui-même des noms à un catalogue de peintures Sinclair et à diverses autres sources. Les 16 premiers — aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow — ont été hérités du matériel VGA. Le CSS moderne spécifie la liste complète comme des codes hex sRGB exacts ; les navigateurs n'approximent pas.

Groupes de couleurs dans la palette nommée

Rouges et roses : red, crimson, salmon, lightcoral, hotpink, deeppink, pink et compagnie. Oranges et bruns : orange, darkorange, coral, tomato, chocolate, sienna, peru. Jaunes et ors : yellow, gold, khaki, palegoldenrod. Verts : green, lime, forestgreen, seagreen, olive, olivedrab — de loin le groupe le plus important. Bleus : blue, navy, royalblue, dodgerblue, steelblue, lightblue. Violets : purple, violet, indigo, orchid, plum, rebeccapurple. Neutres : une dizaine d'alias gray/grey plus silver, white, black.

Questions fréquentes