Trouver le nom d’une couleur
Entrez un code HEX, RGB ou HSL pour trouver le nom de couleur le plus proche, comparer des teintes voisines et copier les valeurs utiles.
Trouver le nom d’une couleur
Qu’est-ce que l’outil de nom de couleur ?
Cet outil identifie le nom le plus proche d’une couleur à partir d’un code HEX, RGB ou HSL. Il compare votre nuance avec les 140 couleurs nommées du standard CSS et avec une base étendue de plus de 1 500 références pour afficher l’appellation la plus pertinente.
Il est particulièrement utile quand vous avez une valeur hexadécimale sous les yeux, mais pas le bon mot pour la décrire dans une maquette, une charte graphique, un brief client ou un fichier CSS. Vous obtenez un nom principal en français, le nom anglais canonique lorsqu’il est utile pour le code, ainsi que cinq couleurs proches à explorer.
Quand l’utiliser
Le chercheur de nom de couleur sert autant en design qu’en intégration web, en communication visuelle ou pour documenter une palette de manière plus claire.
- Web design – Pour retrouver rapidement le nom d’une couleur à partir d’un code HEX et mieux documenter un design system.
- CSS et front-end – Pour savoir si une nuance correspond à une couleur CSS nommée exploitable directement dans le code.
- Branding – Pour décrire une couleur de marque avec un vocabulaire plus parlant qu’une simple suite de chiffres.
- Communication client – Pour parler d’un ton « bleu ardoise », « vert olive » ou « corail » plutôt que d’un #6A5ACD.
- Création de palette – Pour partir d’une couleur principale et repérer des variantes proches à tester.
- Veille créative – Pour nommer une teinte vue dans une affiche, un packaging, une interface ou un moodboard.
Fonctionnalités principales
L’interface a été pensée pour passer vite d’une valeur technique à un nom de couleur exploitable, sans changer d’outil.
- Trois formats d’entrée – Saisissez une couleur en HEX, RGB ou HSL, ou choisissez-la directement via le sélecteur visuel.
- Deux bases de référence – Alternez entre les couleurs CSS standard et une base étendue pour obtenir soit un mot compatible CSS, soit une appellation plus descriptive.
- Nom principal localisé – L’outil privilégie un libellé français naturel quand c’est pertinent et conserve le nom anglais de référence en second niveau si besoin.
- Pourcentage de proximité – Vous voyez immédiatement si la couleur trouvée correspond exactement à votre saisie ou seulement à une nuance proche.
- Suggestions voisines – Cinq couleurs similaires sont proposées pour vous aider à comparer, nuancer ou faire évoluer une palette.
- Copie en un clic – Cliquez sur les codes HEX, RGB ou HSL pour les envoyer directement dans le presse-papiers.
- Historique récent – Les 20 dernières couleurs recherchées restent accessibles depuis votre navigateur pour reprendre un travail plus vite.
Comment utiliser l’outil
Le fonctionnement est volontairement simple : vous saisissez une couleur, l’outil calcule la correspondance la plus proche, puis vous pouvez comparer et copier les valeurs utiles.
- Choisissez votre mode de saisie – Utilisez le sélecteur de couleur, un code HEX, ou renseignez directement les valeurs RGB/HSL.
- Sélectionnez la base – Choisissez « Couleurs CSS » pour viser les mots normalisés du web, ou « Étendue » pour trouver des noms plus variés.
- Consultez la meilleure correspondance – Le nom le plus proche, les codes de la couleur trouvée et le niveau de proximité s’affichent automatiquement.
- Comparez les couleurs proches – Cliquez sur l’une des suggestions pour basculer dessus et poursuivre votre exploration.
- Copiez les valeurs utiles – Appuyez sur un code pour le réutiliser dans Figma, Photoshop, un fichier CSS ou un brief.
Comprendre les bases de couleurs
Les deux bases n’ont pas exactement le même objectif. L’une privilégie la compatibilité web, l’autre la richesse lexicale.
Couleurs CSS (140)
Il s’agit des couleurs nommées définies par le standard W3C. Des noms comme gold, coral ou slateblue peuvent être utilisés directement dans les feuilles de style CSS de tous les navigateurs modernes.
Base étendue (1 500+)
Cette base regroupe des noms issus d’usages graphiques, décoratifs et descriptifs plus larges : nature, aliments, pierres, métaux, pastels, néons ou nuances rétro. Elle est idéale quand vous cherchez un mot plus évocateur qu’un simple nom CSS standard.
Calcul de proximité
La comparaison s’appuie sur une mesure de distance colorimétrique de type Delta E. L’idée est d’approcher la manière dont l’œil humain perçoit les écarts entre deux couleurs pour éviter des rapprochements trompeurs uniquement basés sur les valeurs RGB brutes.
Questions fréquentes
Quelle différence entre les couleurs CSS et la base étendue ?
Les couleurs CSS correspondent aux noms normalisés utilisables directement dans le code, par exemple gold ou tomato. La base étendue contient beaucoup plus d’appellations descriptives, mais ces noms ne sont pas forcément reconnus par CSS et servent surtout à nommer ou comparer une nuance.
Comment le pourcentage de proximité est-il calculé ?
L’outil convertit votre couleur et toutes celles de la base dans un espace de comparaison, puis mesure leur distance. Une valeur de 100 % indique une correspondance exacte ; plus le pourcentage baisse, plus l’écart visuel entre les deux couleurs augmente.
Puis-je saisir un code HEX sur 3 caractères ?
Oui. Un code comme F0A est automatiquement développé en FF00AA. Vous pouvez saisir la valeur avec ou sans le caractère #.
Pourquoi un nom anglais apparaît-il parfois sous le nom français ?
Le nom secondaire sert de repère technique. Les couleurs CSS nommées et de nombreuses références graphiques circulent surtout en anglais dans les outils de design, les frameworks et les feuilles de style. Le garder en seconde ligne facilite la réutilisation dans le code sans nuire à la lecture en français.
Où est enregistré l’historique des couleurs recherchées ?
L’historique est stocké localement dans le navigateur, sur l’appareil que vous utilisez. Il ne part pas vers un autre poste et disparaît si vous videz les données du navigateur ou si vous cliquez sur « Tout effacer ».
Le sélecteur de couleur ne fonctionne pas : que faire ?
Le sélecteur natif dépend du navigateur et du système. Si son affichage est limité, saisissez simplement la couleur en HEX, RGB ou HSL : le résultat sera le même. Une mise à jour du navigateur règle aussi souvent le problème.
Aucun commentaire pour le moment. Laissez le premier avis.