Pipette de couleur sur une image — HEX, RGB et palette
Outil en ligne qui prélève les codes couleur d’une image et crée une palette des couleurs dominantes
Traitement dans le navigateur · aucun envoi de fichier
Déposez l’image dont vous voulez prélever les couleurs
Une image, par exemple JPG, PNG ou WebP. Vous pouvez aussi coller une image copiée avec Ctrl+V (⌘V sur Mac). Elle ne quitte jamais votre navigateur.
Cliquez ou touchez l’image pour prélever la couleur à cet endroit. Après un clic, vous pouvez aussi vous déplacer avec les touches fléchées (Maj + flèche pour 10 pixels).
Loupe
Curseur: -
Couleur prélevée
Aucune couleur prélevée pour l’instant. Cliquez sur l’image.
Palette dominante
Obtenue par k-means : l’image est réduite et les couleurs proches sont regroupées. Une même image donne toujours le même résultat. Cliquez sur une couleur pour la charger ci-dessus.
De quoi s’agit-il ?
Cet outil vous donne la couleur de n’importe quel pixel d’une photo ou d’une maquette, en code HEX (#2563EB), en RGB et en HSL. Cliquez ou touchez l’image pour prélever un pixel ; une loupe agrandit les environs pour viser l’endroit exact. Il crée aussi automatiquement une palette des 5 à 8 couleurs les plus présentes.
Mode d’emploi
- Déposez une image ou cliquez sur Choisir une image. Vous pouvez aussi coller une image copiée avec Ctrl+V (⌘V sur Mac).
- Quand vous survolez l’image, la Loupe à droite montre les pixels voisins agrandis. Cliquez ou touchez l’endroit voulu.
- Lisez les valeurs HEX, RGB et HSL sous Couleur prélevée et cliquez sur Copier.
- Après un clic sur l’image, les touches fléchées déplacent le curseur pixel par pixel, et Maj + flèche de dix pixels, pour un réglage plus fin.
- Dans Palette dominante, choisissez entre 5 et 8 couleurs et cliquez sur une pastille pour la charger dans les valeurs ci-dessus.
Comment ça marche
- HEX : chaque canal en deux chiffres hexadécimaux majuscules. R37 G99 B235 donne #2563EB.
- HSL : teinte de 0 à 360 degrés, saturation et luminosité de 0 à 100 %, arrondies à l’entier. La couleur ci-dessus vaut hsl(221, 83%, 53%).
- Palette : les pixels opaques à au moins 50 % sont regroupés par k-means (initialisation k-means++, graine fixe, 20 itérations au maximum) et les centres sont arrondis. Les groupes les plus grands viennent en premier, avec leur part de l’image en pourcentage.
- Sous-échantillonnage : l’image est réduite à environ 10 000 pixels avant le regroupement, pour que les grandes photos restent rapides. Les pixels sont échantillonnés sans mélange, donc aucune couleur intermédiaire absente de l’image ne se glisse dans la palette.
- Valeurs de couleur : ce sont les valeurs des pixels tels que le navigateur les a dessinés en sRGB ; une image avec un autre profil colorimétrique est lue après sa conversion en sRGB par le navigateur.
Exemples d’utilisation
| Objectif | Méthode |
|---|---|
| Vérifier la couleur de marque d’un logo | cliquez dans une zone unie et copiez le HEX |
| Choisir un fond assorti à une photo | prenez la couleur la plus importante de la palette |
| Examiner un seul pixel | déplacez-vous avec les touches fléchées en regardant la loupe |
Questions fréquentes
Mon image est-elle envoyée en ligne ?
Non. L’affichage de l’image et la lecture des valeurs de pixels se font dans votre navigateur. Ni le fichier ni les couleurs prélevées ne sont envoyés où que ce soit.
La couleur prélevée semble un peu différente de ce que je vois.
L’outil lit les valeurs de pixels que le navigateur a dessinées pour l’écran en sRGB. Si l’image contient un profil colorimétrique comme Display P3 ou Adobe RGB, le navigateur la convertit d’abord en sRGB, donc les valeurs peuvent différer de celles du document dans un logiciel comme Photoshop. Les réglages et la luminosité de l’écran changent aussi le rendu. Les photos contiennent en outre un léger bruit, si bien que des pixels voisins diffèrent un peu. Pour une couleur exacte, cliquez dans une zone unie.
Puis-je prélever au clavier ?
Oui. Cliquez une fois sur l’image ou atteignez-la avec Tab, puis utilisez les touches fléchées pour déplacer le curseur d’un pixel, ou de dix avec Maj. La couleur située dessous est prélevée aussitôt. Entrée ou Espace prélève à nouveau la couleur à la position actuelle. La loupe montre les 11 × 11 pixels alentour.
Comment la palette est-elle choisie ?
L’image est réduite à environ 10 000 pixels et les couleurs proches sont regroupées par k-means en 5 à 8 couleurs. Les points de départ viennent d’une graine aléatoire fixe, donc une même image donne toujours la même palette. Les pixels transparents sont ignorés.
Les très grandes images fonctionnent-elles ?
Si le grand côté dépasse 4096 pixels, l’image est chargée à cette taille et les couleurs sont prélevées sur l’image réduite. Si vous avez besoin d’une précision au pixel près sur une image énorme, recadrez d’abord la partie utile.
Et les pixels partiellement transparents ?
HEX, RGB et HSL n’indiquent que la couleur, sans alpha. Si vous prélevez un pixel semi-transparent, une note précise que l’alpha n’est pas inclus.
