Fonctionnement du sélecteur de couleur d'image
Cet outil permet de sélectionner une image depuis votre appareil pour ensuite prélever n'importe quel pixel afin d'en révéler les valeurs colorimétriques exactes. Pour faciliter cette sélection, une vue agrandie sous forme de loupe s'affiche lors du survol, garantissant un ciblage précis au pixel près.
Dès qu'une image est chargée, l'outil affiche immédiatement les coordonnées et les valeurs du pixel central. Le déplacement du pointeur sur l'image permet d'analyser les pixels un par un. Un clic sur l'image enregistre la couleur active dans un historique de prélèvements.
Pour les utilisateurs qui recherchent une précision maximale ou qui utilisent le clavier, il est possible de déplacer une mire sur l'image à l'aide des touches fléchées. Chaque pression sur une flèche déplace le curseur d'un pixel. En maintenant la touche Shift enfoncée, le déplacement passe à 10 pixels par pression. L'enregistrement de la couleur s'effectue alors en appuyant sur la touche Entrée ou sur la barre d'espacement.
L'historique peut conserver jusqu'à 12 couleurs différentes. Si vous prélevez des pixels ayant les mêmes valeurs RGB mais des niveaux de transparence distincts, l'outil les traite comme des entrées indépendantes et les ajoute séparément à l'historique. Un clic sur l'une des valeurs affichées (HEX, RGB ou HSL) copie directement cette donnée dans le presse-papiers.
Formats d'image acceptés et limites de taille
L'outil traite un seul fichier image à la fois. Les formats et types MIME pris en charge sont les suivants:
- PNG (
image/png) - JPG / JPEG (
image/jpeg) - WebP (
image/webp) - GIF (
image/gif) - AVIF (
image/avif) - HEIC / HEIF (
image/heic,image/heif)
Si vous tentez de glisser-déposer un format non reconnu, le message d'erreur suivant s'affiche: « Ce type de fichier n'est pas pris en charge. Essayez une image PNG, JPG, WebP, GIF, AVIF ou HEIC. » Si le fichier est corrompu ou illisible, l'interface indique: « Impossible d'ouvrir cette image. Elle est peut-être endommagée ou dans un format non pris en charge. »
Pour préserver les performances du navigateur, toute image dont le côté le plus long dépasse 4096 pixels est automatiquement redimensionnée à une échelle inférieure. Le bouton « Recommencer » réinitialise complètement l'outil: il efface l'image active, vide l'historique des prélèvements et restaure l'état initial de l'interface.
Modèles de couleurs et extraction des données
L'outil extrait et convertit simultanément la couleur du pixel sélectionné selon trois modèles distincts:
- HEX: Le code hexadécimal standard (par exemple, #FFFFFF pour le blanc pur).
- RGB: Les composantes Rouge, Vert et Bleu (valeurs de 0 à 255).
- HSL: Les valeurs de Teinte (0 à 360°), Saturation (0 à 100 %) et Luminosité (0 à 100 %).
Gestion de la transparence (Canal Alpha)
Lorsqu'un pixel comporte une transparence, l'outil lit sa valeur propre, de manière isolée, sans tenir compte de la couleur de l'arrière-plan qui se trouve derrière lui. Si le pixel est partiellement transparent, l'interface affiche l'indicateur suivant: « Alpha {n}%: ce pixel est partiellement transparent. » (où {n} représente le pourcentage d'opacité).
Altération des valeurs par la compression
L'outil extrait la valeur binaire exacte stockée dans le fichier image. Cependant, si vous travaillez sur une image au format JPEG ou sur une capture d'écran, les valeurs de couleur d'origine peuvent avoir été modifiées. Les algorithmes de compression avec perte (propres au JPEG) et les techniques d'anticrénelage (anti-aliasing) appliquées aux contours du texte ou des formes géométriques créent des pixels intermédiaires. La couleur prélevée peut donc différer légèrement de la couleur théorique définie lors de la création du visuel.
Intégration aux flux de travail de design et développement
Ce sélecteur de couleur répond aux besoins de plusieurs profils professionnels:
- Développeurs web: Permet d'obtenir rapidement les codes exacts pour les intégrer dans les feuilles de style CSS.
- Designers UI/UX: Facilite l'extraction de couleurs de référence à partir de maquettes ou de captures d'écran pour concevoir des interfaces cohérentes.
- Créateurs de contenu: Aide à échantillonner des teintes précises pour respecter une charte graphique ou harmoniser des retouches d'images.
Le stockage temporaire dans l'historique permet de collecter une palette de 12 teintes de travail sans interrompre la navigation sur l'image.
Confidentialité et traitement des données
Le traitement de l'image s'effectue localement. L'image est lue directement depuis votre appareil et ne quitte jamais votre navigateur. Rien n'est téléversé vers BroBroGo.
FAQ
Comment prélever une couleur sur l'image? Déplacez le pointeur sur l'image: le panneau affiche la couleur située dessous, et une loupe agrandit la zone pour viser le pixel exact. Cliquez pour enregistrer cette couleur dans vos prélèvements. Vous pouvez aussi cibler l'image, déplacer la mire avec les flèches, puis appuyer sur Entrée.
Quels formats de couleur puis-je obtenir? Chaque pixel prélevé s'affiche à la fois en HEX, RGB et HSL. Cliquez sur une valeur pour la copier, prête à coller dans du CSS ou un outil de design.
Pourquoi la couleur prélevée ne correspond-elle pas toujours à ce que j'attendais? Vous obtenez la valeur exacte du pixel enregistrée dans l'image. S'il s'agit d'un JPEG ou d'une capture, la compression et l'anticrénelage ont pu déjà modifier légèrement les pixels voisins; et un pixel semi-transparent est lu seul, sans ce qui se trouve derrière.
Que se passe-t-il si le navigateur bloque la copie dans le presse-papiers? Si les paramètres de sécurité de votre navigateur empêchent l'écriture automatique dans le presse-papiers, l'outil affiche le message d'erreur suivant: « Copie impossible: votre navigateur a bloqué l'accès au presse-papiers. »