Pipette de couleur d’image
Choisissez une photo, un logo ou une capture d’écran. Prélevez un pixel ou extrayez une palette pour votre prochain design.
PNG, JPEG ou WebP · jusqu’à 20 MiB et 16 millions de pixels
Choisissez une image pour sélectionner votre première couleur.
Cliquez ou touchez un point. Placez le focus sur l’image et utilisez les flèches pour avancer d’un pixel ; maintenez Shift pour avancer de 10 pixels. Les coordonnées commencent à 0 dans l’angle supérieur gauche.
Pixel sélectionné
Sélectionnez un point dans l’image.
Vos couleurs sélectionnées
Enregistrez jusqu’à 12 couleurs de l’image, puis téléchargez les valeurs.
Vérifier deux couleurs ensemble
Utilisez l’exemple, saisissez vos couleurs ou affectez une couleur de l’image au texte et au fond. Prévisualisez le duo, vérifiez le contraste et copiez les valeurs pour votre design.
Couleur sélectionnée dans l’image
Choisissez un pixel, puis utilisez-le pour le texte ou le fond.
Choisir une nouvelle image réinitialise l’exemple de couleurs.
Choisissez la surface opaque placée sous les couleurs transparentes.
Utilisez #RGB, #RGBA, #RRGGBB, #RRGGBBAA, rgb(0, 0, 0) ou rgba(0, 0, 0, 0.5). Les canaux RGB sont des entiers de 0 à 255 ; alpha va de 0 à 1.
Aperçu du duo
Une place pour votre prochaine idée
Prenez un carnet, installez-vous et commencez par un petit croquis.
Rapport de contraste
7.46:1
Le rapport affiché est arrondi. La validation utilise toute sa précision.
| Taille du texte | AA | AAA |
|---|---|---|
| Texte normal | Conforme | Conforme |
| Grand texte | Conforme | Conforme |
Un grand texte mesure au moins 18 pt en normal ou 14 pt en gras. Vérifiez la taille utilisée dans votre design final.
Détails du duo
{
"standard": "WCAG 2.2 SC 1.4.3 / 1.4.6",
"colorSpace": "sRGB",
"channels": "RGB 0–255; alpha 0–1",
"foreground": [
35,
78,
82,
1
],
"background": [
245,
230,
200,
1
],
"backdrop": [
255,
255,
255,
1
],
"renderedForeground": [
35,
78,
82,
1
],
"renderedBackground": [
245,
230,
200,
1
],
"ratio": 7.46158578805981,
"checks": {
"normalAA": true,
"normalAAA": true,
"largeAA": true,
"largeAAA": true
}
}Les résultats décrivent ce duo. Utilisez les couleurs d’origine lorsque les bords du texte sont lissés. La transparence est calculée sur le support opaque choisi.
Guide de contraste WCAGExtraire une palette de votre image
Extrayez des couleurs pour votre design, puis copiez ou téléchargez la palette.
Choisissez une image ci-dessus pour extraire sa palette.
Le fichier choisi et les valeurs restent en mémoire sur cette page. Cet outil ne les envoie ni ne les stocke. Les services habituels du site fonctionnent séparément.
Essayer un exemple original à six couleurs
Ce PNG original comporte six blocs unis, dont un rouge semi-transparent et un bloc entièrement transparent. Téléchargez-le et choisissez-le ci-dessus pour examiner les pixels.
Télécharger le PNG d’exemple
Des pixels aux couleurs réutilisables
- Choisissez un PNG, JPEG ou WebP local. L’aperçu s’adapte à l’écran, mais le prélèvement utilise les dimensions naturelles de l’image.
- Cliquez, touchez ou utilisez les flèches pour choisir un pixel. Copiez HEX pour les canaux RGB, ou RGBA pour inclure la transparence.
- Enregistrez les couleurs, puis téléchargez une liste JSON ou TXT avec les valeurs et coordonnées. Ouvrir une autre image efface la sélection et la liste précédentes.
Avant de commencer
Cette pipette d’image est-elle gratuite ?
Oui. La sélection, la copie et le téléchargement fonctionnent dans votre navigateur, sans compte ni crédits.
Que signifie la valeur de transparence ?
Alpha vaut 0 pour une transparence totale et 255 pour une opacité totale. HEX sans alpha et RGB indiquent les canaux de couleur ; RGBA et HEX à huit chiffres incluent la transparence. Le damier est un fond d’aperçu, pas une couleur prélevée dans l’image.
Pourquoi la couleur paraît-elle différente dans une autre application ?
Ce sont les pixels décodés par le navigateur. Les profils colorimétriques, le traitement du navigateur, l’affichage et l’impression peuvent modifier leur apparence. Utilisez ces valeurs et vérifiez le rendu final à destination.
L’outil envoie-t-il mon image ?
Non. Le fichier local est décodé et échantillonné dans cette page. L’outil ne l’envoie pas au serveur et ne l’enregistre pas dans l’historique. Le chargement de la page et le téléchargement de l’exemple public utilisent la connexion normale du site.
Puis-je créer une palette à partir de mon image ?
Oui. Extraire la palette fournit trois, cinq ou huit couleurs représentatives à copier ou télécharger. Vous pouvez aussi choisir et enregistrer manuellement jusqu’à 12 couleurs avec leurs coordonnées.