Pipette Couleur sur Image en ligne | HEX, RGB, HSL | Awesome Toolkit

Pipette de Couleur sur Image

Cliquez sur un pixel d'une image pour obtenir sa couleur en HEX, RGB et HSL. Extrayez aussi une palette de couleurs dominantes.

Par Marshkalk

Déposez une image ici ou

Retrouver les couleurs d'un logo sans fichiers sources

Situation classique en agence française : un client transmet un logo en JPEG ou PNG sans fournir le fichier Illustrator ou Figma original. Cet outil resout le probleme en quelques secondes. Chargez l'image, cliquez sur la zone coloree, et le code HEX exact s'affiche immediatement. Les studios parisiens l'utilisent aussi pour l'analyse concurrentielle : une capture d'ecran d'un site concurrent suffit pour recuperer ses couleurs de header ou de boutons CTA.

Les extensions Chrome Colour Picker, tres populaires dans les agences, remplissent une fonction similaire, mais elles necessitent une installation. Cet outil fonctionne directement dans le navigateur, sans extension, et sort HEX, RGB, HSL et RGBA en un clic. Pour extraire une palette complete depuis une image, utilisez l'Extracteur de Palette.

Formats de couleur

FormatExempleUsage typique
HEX#1a73e8CSS, HTML, Figma, XD
RGBrgb(26, 115, 232)CSS, traitement d'image
HSLhsl(217, 79%, 51%)CSS, mode sombre
RGBArgba(26, 115, 232, 1)CSS avec transparence

Limites de la pipette au niveau pixel

La compression JPEG introduit des artefacts , les pixels en bordure d'un logo peuvent ne pas representer la vraie couleur du fond plat. Pour de meilleurs resultats, utilisez une capture PNG ou SVG. Cliquez au centre d'une zone coloree plutot que sur ses bords. Les differents profils coloriels des ecrans (sRGB vs Display P3 sur Mac) peuvent introduire un ecart visuel ; la valeur affichee est celle du pixel brut en sRGB. Pour l'impression, Pantone vs HEX reste une conversion distincte : un code HEX ne correspond pas directement a une encre Pantone.

De la couleur selectionnee au systeme de design

Une fois le code HEX obtenu, collez-le dans le Generateur de Palette pour construire une echelle complete de teintes et nuances (config Tailwind CSS ou tokens design). En photographie , tres pratiquee en France en amateur et en professionnel , cette pipette permet de prelever la teinte dominante d'une image de reference pour en deriver une palette coherente dans Lightroom ou pour les reseaux sociaux.