Pipette à couleurs d’une image

Pointez n’importe quel endroit de l’image pour son hex, RGB et HSL, et découvrez les quelques couleurs dont elle est faite. Chacune indique si un texte y sera lisible. Rien n’est envoyé.

Comment ça marche

Récupérer une couleur dans une image est le genre de chose que le système d’exploitation devrait faire et ne fait presque jamais. La couleur qu’il vous faut est dans une photo de mur, dans la capture d’un graphique, dans un logo envoyé en JPEG, et ce dont vous avez besoin, ce sont six chiffres hexadécimaux à coller dans une feuille de style.

Pointer un pixel est la moitié facile. L’image est dessinée un pour un et le lissage désactivé avant la lecture du pixel, ce qui a l’air pédant et ne l’est pas : avec le lissage, le navigateur renvoie un mélange du pixel et de ses voisins, si bien que la couleur obtenue n’a jamais existé dans l’image et ne correspond pas une fois collée.

La palette est la moitié difficile, et la méthode classique a un défaut bien connu. La coupe médiane range les couleurs dans des boîtes, puis le manuel fait la moyenne de chaque boîte : c’est ainsi que les outils de palette produisent des bruns boueux absents de l’original, car la moyenne d’une fleur rouge et d’une feuille verte, c’est de la boue. Ici chaque échantillon est le vrai pixel le plus proche de sa boîte, donc toute couleur proposée est une couleur que vous auriez pu pointer vous-même. Les pourcentages sont calculés à part, en demandant de quel échantillon chaque pixel est le plus proche, car la coupe médiane donne volontairement le même nombre de pixels à chaque boîte, et lire cela comme un pourcentage reviendrait à affirmer que toutes les couleurs occupent autant de place dans une photo manifestement remplie de ciel.

Reste le chiffre qui décide si tout cela est utilisable. Une couleur tirée d’une photo finit presque toujours derrière du texte, et savoir si cela fonctionne se mesure : le rapport de contraste WCAG sur blanc et sur noir, avec le seuil indiqué. Une couleur de marque superbe dans un logo donne souvent 2,8:1 sur blanc, et c’est une décision à prendre exprès plutôt qu’à découvrir plus tard.

Comment l’utiliser

  1. 1 Choisissez une image, ou collez-en une directement depuis le presse-papiers.
  2. 2 Touchez n’importe quel point de l’image pour prendre la couleur qui s’y trouve.
  3. 3 Copiez l’hex, le RGB ou le HSL d’un geste.
  4. 4 Ou prenez l’un des échantillons ci-dessous, qui sont les couleurs dont l’image est faite.

Bon à savoir

  • Chaque échantillon est une couleur réellement présente dans l’image, jamais la moyenne de deux qui y sont.
  • La palette est classée selon la part de l’image que chaque couleur occupe, pas par teinte.
  • Le contraste est le rapport WCAG : 4,5:1 est le seuil pour le texte courant et 3:1 pour le grand texte.
  • La couleur est lue lissage désactivé : c’est le pixel exact et non un mélange avec ses voisins.
  • Les captures d’écran marchent aussi bien que les photos, ce qui est la manière rapide de tirer une couleur d’un graphique.

Navigateurs compatibles

  • Chrome 94 et suivantes
  • Firefox 93 et suivantes
  • Safari 16.4 et suivantes
  • Edge 94 et suivantes

Ce sont les plus anciennes versions qui ont tout ce que l’outil utilise. Elles sont calculées à partir de l’outil lui-même, donc elles changent avec lui.

Numéros de version vérifiés le 2026-09-04.

Questions fréquentes

Comment obtenir le code hex d’une couleur dans une image ?

Choisissez l’image et touchez l’endroit voulu. L’hex, le RGB et le HSL s’affichent dessous, et un geste copie l’un d’eux. Le pixel est lu exactement, sans lissage, donc ce que vous collez correspond à ce que vous avez pointé.

Comment trouver les couleurs dominantes d’une image ?

Elles sont calculées dès le chargement et présentées en échantillons, chacun indiquant la part de l’image qui lui revient. Touchez un échantillon pour en faire la couleur courante et voir ses valeurs de contraste.

Pourquoi les autres outils de palette me donnent-ils des couleurs boueuses ?

Parce qu’ils font la moyenne de chaque groupe de couleurs trouvé, et la moyenne de deux couleurs très différentes est une couleur qui n’est dans aucune des deux. Celui-ci prend plutôt le vrai pixel le plus proche de cette moyenne : une fleur rouge et une feuille verte donnent du rouge et du vert, pas du brun.

Que signifient les chiffres de contraste ?

Ce sont des rapports de contraste WCAG sur blanc et sur noir, de 1:1 à 21:1. 4,5:1 ou mieux passe le niveau AA pour le texte courant, 7:1 passe AAA, et 3:1 ne suffit que pour du grand texte. En dessous de 3:1 la couleur n’est pas utilisable derrière du texte.

Puis-je prendre une couleur dans une capture d’écran ?

Oui, et c’est l’un des usages les plus utiles ici. Collez une capture avec Ctrl+V et touchez la barre d’un graphique ou le fond d’une application pour obtenir son hex exact.

Mon image est-elle envoyée quelque part ?

Non. Elle est décodée et lue dans cet onglet, par votre propre appareil, et aucune copie n’est envoyée nulle part. Vous pouvez surveiller l’onglet Réseau de votre navigateur pendant que vous travaillez.

Outils associés

Vos fichiers sont traités sur votre appareil et ne sont pas envoyés. Vous pouvez le vérifier dans les outils de développement de votre navigateur, sous l’onglet Réseau.