Sélecteur de couleur
Prélevez n’importe quelle couleur depuis une image et obtenez instantanément les codes HEX, RGB, HSL, HSV et CMJN.
Importez une image pour choisir une couleur
Glissez-déposez, collez ou parcourez — PNG, JPG, WEBP ou GIF
Astuce : vous pouvez aussi coller une image avec Ctrl/Cmd + V
Codes couleur
Nom de couleur le plus proche: Royal Blue
Harmonies de couleurs
Vérificateur de contraste (WCAG)
Exemple de texte
Couleurs enregistrées
Aucune couleur enregistrée pour l’instant — choisissez-en une et appuyez sur « Enregistrer la couleur ».
Un sélecteur de couleur (ou pipette) est un outil qui vous permet d’identifier la couleur exacte d’un pixel et de la traduire en codes exploitables partout : HEX, RGB, HSL, HSV et CMJN. Que vous prépariez une maquette web, régliez les variables d’une feuille de style, prépariez un visuel pour l’impression ou vérifiiez la lisibilité d’un texte, connaître la valeur précise d’une couleur fait gagner un temps précieux et évite les approximations.
Notre sélecteur de couleur est entièrement gratuit et fonctionne directement dans votre navigateur : votre image n’est jamais envoyée sur un serveur, tout le traitement reste sur votre appareil, ce qui garantit votre confidentialité. En un clic, vous obtenez les codes HEX, RGB, HSL, HSV et CMJN, vous pouvez extraire une palette complète depuis n’importe quelle photo, générer des harmonies de couleurs et contrôler le contraste selon les critères d’accessibilité WCAG.
Comment prélever une couleur depuis une image
- 1
Importez votre image
Glissez-déposez une image dans la zone prévue, cliquez pour parcourir vos fichiers ou collez-la directement avec Ctrl/Cmd + V. Les formats PNG, JPG, WEBP et GIF sont pris en charge, et tout reste dans votre navigateur.
- 2
Cliquez avec la pipette
Déplacez le curseur sur l’image et cliquez sur le pixel dont vous voulez connaître la couleur. Le zoom vous aide à viser précisément le point exact, même sur des détails fins.
- 3
Lisez et copiez les codes
La couleur sélectionnée s’affiche instantanément avec ses valeurs HEX, RGB, HSL, HSV et CMJN. Cliquez sur « Copier » à côté du format souhaité pour le placer dans votre presse-papiers.
- 4
Extrayez une palette de l’image
Lancez l’extraction de palette pour obtenir automatiquement les couleurs dominantes de la photo. Idéal pour construire une charte cohérente à partir d’une inspiration visuelle.
- 5
Générez des harmonies de couleurs
À partir de votre couleur de base, générez des combinaisons complémentaires, analogues, triadiques ou monochromatiques pour trouver des associations équilibrées en un instant.
- 6
Vérifiez le contraste et exportez
Contrôlez le contraste entre le texte et l’arrière-plan selon les seuils WCAG, puis enregistrez vos couleurs et exportez la palette en CSS, JSON ou PNG.
HEX, RGB, HSL, HSV et CMJN expliqués
Une même couleur peut s’écrire de plusieurs façons selon le contexte. Chaque modèle décrit la teinte différemment : certains sont pensés pour les écrans, d’autres pour l’impression, d’autres encore pour ajuster une nuance de manière intuitive. Voici les cinq notations les plus courantes et à quoi elles servent.
| Model | Example | Best for |
|---|---|---|
| HEX | #3B82F6 | Le web et le CSS : notation compacte, idéale pour le code et les feuilles de style. |
| RGB | rgb(59,130,246) | Les écrans : mélange de rouge, vert et bleu, tel que l’affichent les moniteurs. |
| HSL | hsl(217,91%,60%) | Le réglage intuitif : ajustez teinte, saturation et luminosité séparément. |
| HSV | hsv(217,76%,96%) | Les outils de design : teinte, saturation et valeur, comme dans les sélecteurs graphiques. |
| CMYK | cmyk(76%,47%,0%,4%) | L’impression : le modèle CMJN (cyan, magenta, jaune, noir) utilisé par les imprimeurs. |
Design web & interface
Prélevez les couleurs exactes d’une maquette, d’un logo ou d’une capture d’écran pour construire une interface cohérente. Les harmonies de couleurs vous aident à composer une palette équilibrée, tandis que les valeurs HEX et HSL s’intègrent directement dans vos maquettes Figma ou vos systèmes de design.
Développement front-end
Copiez instantanément les codes HEX ou RGB pour vos variables CSS, vos tokens de thème ou vos composants. Le modèle HSL facilite la création de variantes (survol, état actif, mode sombre) en jouant simplement sur la luminosité, sans deviner de nouvelles valeurs.
Impression & identité de marque
Récupérez les équivalents CMJN de vos couleurs pour préparer des fichiers destinés à l’impression : brochures, cartes de visite, packaging. Vous vous assurez ainsi que le rendu papier reste fidèle à votre identité de marque affichée à l’écran.
Accessibilité
Vérifiez le contraste entre votre texte et son arrière-plan selon les critères WCAG (niveaux AA et AAA). Vous garantissez ainsi que vos contenus restent lisibles pour toutes et tous, y compris les personnes malvoyantes, et conformes aux bonnes pratiques d’accessibilité.
Le comparatif
Beaucoup de pipettes en ligne se limitent à afficher un code HEX au milieu de publicités. Voici comment notre sélecteur de couleur se distingue face à un outil comme imagecolorpicker.com.
| Modèles de couleur | HEX, RGB, HSL, HSV et CMJN, tous affichés et copiables en un clic. | Se concentre principalement sur HEX et RGB. |
| CMJN pour l’impression | Conversion CMJN intégrée pour préparer vos fichiers d’impression. | Pas de valeurs CMJN dédiées à l’impression. |
| Vérificateur de contraste WCAG | Contrôle du contraste AA/AAA intégré pour l’accessibilité. | Aucun vérificateur de contraste. |
| Harmonies de couleurs | Complémentaires, analogues, triadiques, monochromatiques et plus. | Suggestions d’harmonies limitées, voire absentes. |
| Publicités | Interface épurée, sans publicité intrusive. | Nombreuses publicités qui gênent la navigation. |
Questions fréquentes
Comment prélever une couleur depuis une image ?
Importez votre image (par glisser-déposer, collage ou en parcourant vos fichiers), puis cliquez avec la pipette sur le pixel dont vous voulez connaître la couleur. Ses codes HEX, RGB, HSL, HSV et CMJN s’affichent aussitôt, prêts à être copiés.
Qu’est-ce qu’un code couleur HEX ?
Un code HEX est une notation hexadécimale à six caractères, précédée d’un dièse (par exemple #3B82F6). Les deux premiers caractères représentent le rouge, les deux suivants le vert et les deux derniers le bleu. C’est le format le plus utilisé sur le web et en CSS.
Comment convertir du RGB en HEX ?
Il suffit de sélectionner une couleur dans l’outil : la valeur RGB et son équivalent HEX s’affichent côte à côte automatiquement. Vous pouvez copier l’un ou l’autre en un clic, sans calcul manuel.
Comment créer une palette à partir d’une photo ?
Importez la photo et lancez l’extraction de palette : l’outil détecte automatiquement les couleurs dominantes de l’image. Vous pouvez ensuite enregistrer ces couleurs et exporter la palette en CSS, JSON ou PNG.
Comment vérifier le contraste des couleurs pour l’accessibilité ?
Utilisez le vérificateur de contraste intégré : choisissez une couleur de texte et une couleur d’arrière-plan, et l’outil calcule le ratio de contraste puis indique s’il respecte les seuils WCAG AA et AAA, pour un texte normal comme pour un texte de grande taille.
L’outil est-il gratuit et respecte-t-il ma vie privée ?
Oui. Le sélecteur de couleur est entièrement gratuit et fonctionne exclusivement dans votre navigateur. Votre image n’est jamais téléversée sur un serveur : tout le traitement se fait localement sur votre appareil, ce qui protège votre confidentialité.
