Nom de couleur
Un chercheur de nom de couleur prend un code hexadécimal et renvoie le mot-clé CSS le plus proche. Celui-ci compare votre valeur aux 141 couleurs nommées de sa liste et indique l’écart : #3B82F6 revient en RoyalBlue (#4169E1), noté Proche, #1DA1F2 donne DodgerBlue (#1E90FF), Très proche, et #FF7F50 correspond exactement à Coral.
Votre couleur
Correspondance la plus proche
Outils populaires
À propos de Nom de couleur
Le chercheur de nom de couleur répond à une seule question : comment s’appelle cette couleur ? Saisissez ou collez une valeur hexadécimale dans Entrez une couleur, ou ouvrez le sélecteur à côté, et l’outil compare votre couleur aux 141 mots-clés de couleur CSS qu’il embarque. La carte Correspondance la plus proche donne le nom gagnant, et les boutons HEX, RGB et HSL en dessous copient cette correspondance — RoyalBlue en #4169E1, rgb(65, 105, 225), hsl(225, 73%, 57%) — et non la valeur que vous avez saisie.
La comparaison est une distance en ligne droite dans l’espace RVB : les canaux rouge, vert et bleu des deux couleurs sont soustraits, élevés au carré, additionnés puis passés à la racine carrée. Qualité de correspondance traduit ce nombre en mot — Correspondance exacte ! à zéro, Très proche en dessous de 30, Proche en dessous de 80, Approximatif au-delà. #3B82F6 et RoyalBlue sont séparés de 33 unités, d’où la mention Proche. La mesure est arithmétique et non perceptuelle : ni conversion Lab, ni formule delta E.
L’onglet Parcourir tout affiche les 141 échantillons d’un coup, avec un champ de recherche qui filtre sur le nom comme sur le texte hexadécimal, et dix filtres : Tous, Rouge, Orange, Jaune, Vert, Bleu, Violet, Rose, Gris et Blanc. Cliquez un échantillon et il repart dans le chercheur en correspondance exacte. L’étiquette de chaque échantillon bascule du noir au blanc selon la formule de luminance relative définie par les WCAG.
Limites : la liste ne contient que des mots-clés CSS — ni Pantone, ni RAL, ni nuanciers de peinture, pas de pipette sur une photo importée, aucun nom inventé. Quand deux mots-clés partagent un hexadécimal, le premier de la liste l’emporte : #00FFFF renvoie toujours Aqua et jamais Cyan, #FF00FF renvoie Fuchsia plutôt que Magenta. La comparaison se fait dans la page ; rien n’est envoyé.
Cas d'utilisation
Comment utiliser
Restez sur l’onglet Chercheur de couleur et faites glisser le sélecteur de couleur à gauche, ou tapez une valeur hexadécimale comme #3B82F6 dans le champ Entrez une couleur.
Lisez les deux cartes : Votre couleur reprend votre saisie, Correspondance la plus proche nomme le mot-clé CSS le plus proche.
Regardez la ligne Qualité de correspondance en dessous — Correspondance exacte !, Très proche, Proche ou Approximatif — pour situer l’écart.
Cliquez sur le bouton HEX, RGB ou HSL pour copier la couleur trouvée dans cette notation.
Pour l’opération inverse, passez sur Parcourir tout, réduisez la grille avec la recherche ou une puce de catégorie, puis cliquez un échantillon pour le charger dans le chercheur.
Astuces Pro
- Les boutons HEX, RGB et HSL copient les valeurs du mot-clé trouvé, pas la couleur que vous avez saisie : pour récupérer votre propre hexadécimal, prenez-le dans le champ Entrez une couleur.
- Le champ accepte la notation à trois chiffres : #f00 est étendu en #FF0000 et rapporté comme Red, Correspondance exacte !
- La recherche de Parcourir tout filtre aussi sur le texte hexadécimal : taper 8b réduit la grille aux mots-clés comme DarkMagenta ou DarkRed dont le code contient ces caractères.
- Cliquer un échantillon dans Parcourir tout ramène au chercheur avec Qualité de correspondance sur Correspondance exacte ! — le moyen le plus rapide de lire le RGB et le HSL d’un mot-clé.
- Aqua et Cyan partagent #00FFFF, Fuchsia et Magenta partagent #FF00FF ; le chercheur garde le premier mot-clé rencontré à la distance la plus courte, donc ces codes ressortent toujours en Aqua et Fuchsia.
Dépannage
Les cartes de résultat disparaissent quand je colle rgb(59, 130, 246) ou un nom de couleur.
Entrez une couleur ne lit que l’hexadécimal. Toute autre saisie échoue à l’analyse, aucune distance ne peut être calculée et le panneau se masque. Convertissez d’abord en hexadécimal, ou passez par le champ de recherche de Parcourir tout si vous avez un mot-clé et non un code.
Le bouton HEX a copié un code que je n’ai jamais saisi.
Les trois boutons de copie appartiennent à la carte Correspondance la plus proche : ils copient le mot-clé trouvé. Saisissez #3B82F6 et HEX donne #4169E1, la valeur de RoyalBlue. Pour copier votre propre couleur, sélectionnez-la dans le champ Entrez une couleur.
La mention Copié apparaît mais le presse-papiers est vide.
La confirmation s’affiche dès la demande de copie, alors que l’API presse-papiers du navigateur peut encore refuser : elle exige une page sécurisée et un vrai clic, et des extensions la bloquent. Sélectionnez la valeur dans la carte et appuyez sur Ctrl+C, ou Cmd+C sur Mac.
La grille de Parcourir tout est vide.
Le champ de recherche et les puces de catégorie s’appliquent ensemble : un filtre Rose combiné à une recherche « bleu » ne laisse rien. Videz la recherche et remettez la catégorie sur Tous ; le compteur sous la grille doit afficher 141 couleurs affichées.
Toutes mes couleurs ressortent en Approximatif.
Cette mention signifie que le mot-clé le plus proche est à plus de 80 unités en RVB. Avec seulement 141 mots-clés, des zones entières — bruns ternes, turquoises désaturés, la plupart des pastels — n’ont aucun voisin proche. Traitez le nom comme une étiquette approximative et gardez l’hexadécimal comme référence.
Questions fréquemment posées
Collez le code dans Entrez une couleur et lisez la carte Correspondance la plus proche. Si votre valeur fait partie des 141 mots-clés CSS, la carte la nomme et Qualité de correspondance affiche Correspondance exacte ! — #FF7F50 donne Coral. Sinon vous obtenez le mot-clé le plus proche avec la mention Très proche, Proche ou Approximatif, et les boutons HEX, RGB et HSL copient ses valeurs.
Aucun chiffre officiel unique n’est citable : la référence named-color de MDN décrit les 16 mots-clés de CSS niveau 1 plus orange, puis indique qu’environ 150 autres couleurs disposent d’un mot-clé, et des paires comme aqua et cyan sont des alias comptés deux fois dans certaines listes. Ce qui est exact ici, c’est l’ensemble de l’outil : 141 mots-clés, tous visibles sous Parcourir tout.
Vous recevez le mot-clé le plus proche accompagné d’une mention de qualité. #3B82F6 n’est pas un mot-clé CSS : le chercheur renvoie RoyalBlue (#4169E1) noté Proche, les deux étant séparés de 33 unités en RVB. Utilisez le nom quand une approximation suffit — un commentaire, un ticket, une planche d’ambiance — et gardez votre hexadécimal dans la feuille de styles.
Pas ici. Il n’y a ni import d’image ni pipette : les seules entrées sont le champ hexadécimal et le sélecteur de couleur à côté. Pour nommer une couleur dans une photo, prélevez le pixel avec le sélecteur de votre système ou une extension de navigateur, copiez l’hexadécimal obtenu et collez-le dans Entrez une couleur.
Non. Pantone, RAL et les nuanciers de peinture sont des catalogues propriétaires, absents de cet outil. Tout ce qu’il renvoie est un mot-clé de couleur CSS — l’un des 141 noms listés sous Parcourir tout — c’est-à-dire ce qu’un navigateur comprend dans une feuille de styles.
Pas directement. Le champ ne lit que l’hexadécimal : coller rgb(59, 130, 246) fait disparaître le panneau de résultat, faute d’analyse possible. Convertissez d’abord le triplet — 59, 130, 246 correspond à #3B82F6 — puis collez-le. Une fois la correspondance trouvée, le bouton RGB vous rend le mot-clé en notation rgb().
Oui, dans l’onglet Parcourir tout. Le champ de recherche filtre les 141 échantillons à la frappe et compare le mot-clé comme le texte hexadécimal : taper vert ou green réduit la grille. Cliquez un échantillon et le chercheur se rouvre avec cette couleur chargée et Correspondance exacte !
Ce sont des alias : aqua et cyan valent tous deux #00FFFF, fuchsia et magenta tous deux #FF00FF. La page named-color de MDN présente les deux paires comme des mots-clés équivalents. Comme le chercheur conserve le premier mot-clé rencontré à la distance la plus courte, #00FFFF ressort en Aqua et #FF00FF en Fuchsia ; l’autre nom reste tout aussi valide en CSS.
Il mesure une distance en ligne droite entre les canaux rouge, vert et bleu des deux couleurs : chaque écart est élevé au carré, les trois sont additionnés, puis la racine carrée est prise. La plus petite distance gagne. Zéro signifie des codes identiques, moins de 30 donne Très proche, moins de 80 Proche, au-delà Approximatif. La mesure est arithmétique, pas perceptuelle.
Les 16 premiers mots-clés viennent de CSS niveau 1 et orange de CSS niveau 2 ; la longue traîne — DarkSlateGray, PapayaWhip, LemonChiffon et les autres — est arrivée dans CSS depuis la liste de couleurs X11 via SVG, comme l’explique la référence named-color de MDN. D’où un ensemble inégal : plusieurs gris et verts presque identiques voisinent avec des zones sans aucun mot-clé proche.