Comment Extraire Les Codes Couleurs D'une Image?

Quelle est la meilleure façon de choisir les codes de couleur d'une image ?

Il s'avère qu'il n'y a pas trop de réponses à cette question en ligne, nous avons donc décidé de créer un article qui répondrait à cette question de la manière la meilleure et la plus utile possible.

Que ce soit via un site Web, une application ou une extension Chrome, ils présentent tous des avantages et des inconvénients différents.

Voici 5 façons de choisir HEX, RGB, HSL et de nombreux autres codes de couleur à partir de n'importe quelle photo.

1- Utiliser ImageColorFinder.com

Nous promettons que le but de cet article n'est pas seulement de commercialiser notre propre outil, mais c'est en quelque sorte :)

Après avoir fait quelques recherches en ligne, nous avons remarqué que les options disponibles n'étaient pas très conviviales ou comportaient tout simplement trop de publicités sur chaque page.

C'est pourquoi nous avons décidé de créer >ImageColorFinder.com

page d'accueil de l'outil de recherche de couleurs d'image

Notre outil vous permet non seulement de télécharger votre propre image, de choisir automatiquement la meilleure palette de couleurs et de choisir manuellement une couleur, mais il peut également générer des images aléatoires à partir d'Internet pour vous inspirer de ces couleurs à la place.

Cela signifie que, si votre objectif principal est de trouver un jeu de couleurs pour vos projets et conceptions, alors en regardant autour d'autres images en ligne, vous pourrez potentiellement le faire plus rapidement.

Voici comment cela fonctionne :

Étape 1 : Téléchargez votre propre image

Cliquez simplement sur le bouton de téléchargement et recherchez cette image dans votre appareil. 

Vous pouvez télécharger n'importe quel format d'image, ainsi que des fichiers GIF et SVG.

Une fois téléchargée, votre image sera analysée et notre outil vous montrera et vous proposera quelques couleurs qui pourraient être celles que vous essayez d'obtenir.

Si ce n'est pas le cas, la prochaine étape vous aidera malgré tout.

Étape 2 : Appuyez, cliquez, survolez ou appuyez sur le conteneur d'images

Si les couleurs générées ne correspondent pas à ce que vous recherchez, vous pouvez sélectionner manuellement les couleurs de n'importe quelle image.

Pour ce faire, vous utiliserez la pipette pour plus de précision et de facilité.

Cette pipette sera activée une fois que vous aurez appuyé, cliqué ou tapé sur l'image. 

Une fois que cela se produit, vous pouvez vous déplacer et rechercher la couleur exacte que vous souhaitez. 

Les coins de la pipette vous montreront également la couleur sur laquelle vous survolez actuellement, et le carré rouge à l'intérieur vous aidera à voir exactement où vous vous trouvez dans l'image.

Étape 3 : Copiez la valeur de couleur  

Une fois que vous avez terminé l'étape 2, la dernière étape devrait simplement consister à copier les codes de couleur que vous avez obtenus de notre outil.

Pour ce faire, vous pouvez simplement appuyer sur le conteneur de couleur et sa valeur sera automatiquement copiée dans votre presse-papiers.

2- Utilisation des outils de développement Chrome

Si vous êtes un développeur ou si vous avez des connaissances sur le fonctionnement de Chrome et du Web, vous pouvez utiliser cette méthode. Sinon, je vous encourage vraiment à vous en tenir à la méthode n ° 1.

Dans ce cas, vous pouvez ouvrir l'image à l'aide de Chrome, puis inspecter la page pour utiliser la pipette intégrée de Chrome afin de trouver les codes de couleur de cette image.

Voici comment cela fonctionnerait :

Étape 1 : Ouvrez ou faites glisser le fichier image sur Chrome

Pour cette étape, vous pouvez simplement cliquer avec le bouton droit sur une image et sélectionner Ouvrir avec > Chrome.

D'autre part, vous pouvez ouvrir Chrome directement et faire glisser l'image vers un nouvel onglet ou un onglet actuellement ouvert.

Étape 2 : Appuyez sur le clic droit puis inspectez la page ou Ctrl + Maj + I

Après avoir ouvert votre image dans un onglet Chrome, inspectez simplement la page à l'aide des outils de développement Chrome.

Pour ce faire, vous pouvez soit cliquer avec le bouton droit sur la page, puis sélectionner inspecter la page, soit appuyer simplement sur Ctrl + Maj + I.

Ce que cela fera, c'est qu'il ouvrira un nouvel onglet à droite de votre écran.

Étape 3 : Cliquez sur ou créez n'importe quelle couleur dans le conteneur Styles 

Dans cette étape, nous rechercherons toutes les propriétés de couleur dans le conteneur de styles, ou nous en créerons une au hasard. 

Après cela, nous pouvons cliquer sur ladite couleur et la remplacer par celle dont nous essayons d'obtenir la valeur de couleur exacte.

3- En utilisant le Paint de Windows intégré

Si votre PC fonctionne sous Windows, un moyen très simple de le faire pourrait être d'utiliser Paint. 

Cette fois cependant, au lieu d'ouvrir l'image avec Chrome, nous ferons simplement un clic droit dessus et sélectionnerons Modifier.

Maintenant, dans le tableau de bord Paint, sélectionnez le sélecteur de couleurs et choisissez la couleur exacte à partir de laquelle vous souhaitez copier sa valeur.

Après cela, vous pouvez appuyer sur "Modifier les couleurs" et la peinture aura la dernière couleur que vous avez choisie dans les valeurs RGB et HSL.

4- Télécharger et utiliser les extensions Chrome

Ces deux dernières méthodes sont mes moins préférées car elles vous obligent à installer un logiciel supplémentaire sur votre appareil, mais elles peuvent sûrement vous aider dans cette situation.

Pour cette méthode, il existe de nombreuses extensions Chrome qui vous permettent d'obtenir les codes de couleur sur n'importe quel site Web. 

Ils fonctionnent de manière très similaire aux 2 premières méthodes de cette liste, c'est pourquoi je ne les vois pas aussi pratiques. 

Mais pour ceux d'entre vous qui ne savent pas comment inspecter une page dans Chrome et faire tout le travail supplémentaire pour utiliser la pipette de Chrome, c'est aussi une bonne alternative.

Je vous encourage à vous rendre sur le Chrome Web Store et à rechercher un sélecteur de couleurs qui correspond à vos besoins et fonctionne sans aucun problème. 

Quelques-uns que je recommanderais sont Colorgrab et Color Picker.

5- Utiliser des applications mobiles

L'utilisation d'applications mobiles peut également être très pratique pour certaines personnes, mais pas très pratique pour ceux d'entre vous qui ont juste besoin de faire ce genre de choses de temps en temps. 

La plupart des applications mobiles fonctionneront de la même manière que la première méthode que nous avons mentionnée. 

Vous téléchargerez une image et vous n'aurez qu'à en choisir une certaine couleur. 

Dans les appareils IOs, >Color Names AR serait le premier que je vérifierais, et sur Android, ce serait >Color Picker .

Attention cependant, une offre premium vous sera proposée lorsque vous entrerez dans l'application, cliquez simplement sur le bouton X pour ne pas payer et utiliser la version gratuite à la place.

Conclusion

En fin de compte, cela dépend vraiment de ce que vous recherchez et du temps que vous êtes prêt à consacrer à cela. 

Si c'est juste quelque chose dont vous avez besoin maintenant, et probablement jamais, alors les 2 premières méthodes sont les meilleures, si vous le faites de manière cohérente, alors la première et les deux dernières sont de loin plus pratiques. 

Merci d'avoir lu et d'être ici! 🤟