Sélecteur de couleurs et convertisseur de codes couleur Color Picker

Oui, le Color Picker est gratuit et utilisable sans inscription. Toutes les conversions se font dans ton navigateur : aucun envoi, aucune journalisation ni requête au serveur. Seule l’URL de la page reprend la couleur actuelle avec ?color=, pour que tu puisses la partager ou l’enregistrer en favori.

Clique sur le champ coloré à côté de « Couleur CSS la plus proche : », choisis la saturation et la luminosité dans le carré, puis la teinte en dessous. Le code HEX apparaît en haut du résultat et peut être copié avec le bouton prévu. Si tu connais déjà la couleur en RGB, HSL, HSV ou CMYK, saisis sa valeur dans le champ correspondant. Pour une couleur tirée d’une photo ou d’une capture d’écran, utilise l’Image Color Picker : cet outil ne lit pas les images. Accéder à l’Image Color Picker

Saisis ou colle une valeur dans le champ RGB, par exemple 24, 232, 136 ou rgb(24, 232, 136). Le champ HEX affiche aussitôt #18e888, et HSL, HSV et CMYK se mettent aussi à jour. Dans l’autre sens, saisis le code HEX avec ou sans # dans le champ HEX. Les deux notations décrivent la même couleur à l’écran : HEX écrit les trois valeurs RGB de 0 à 255 sous forme de paires hexadécimales de 00 à ff.

RGB décrit une couleur par ses composantes lumineuses rouge, verte et bleue, telles qu’un écran les mélange. HSL (teinte/saturation/luminosité) et HSV (teinte/saturation/valeur) sont deux conversions différentes d’une même valeur RGB, plus intuitives pour les humains. HSL convient pour éclaircir ou assombrir une couleur ; HSV, pour la composer à partir d’une palette de teintes, de saturations et de valeurs. CMYK (cyan/magenta/jaune/noir) ne décrit pas un mélange de lumière, mais un mélange d’encres ou de toners utilisé pour l’impression.

La valeur CMYK est une approximation calculée sans profil colorimétrique, arrondie au pourcentage entier. Elle t’aide à situer une couleur d’écran pour l’impression, mais ne remplace pas une épreuve avec le profil de ton imprimeur. Tu peux saisir une valeur CMYK sous la forme 0%, 61%, 72%, 0% ou cmyk(0%, 61%, 72%, 0%).

Oui. Règle l’opacité de 0 à 100 % avec le curseur : le résultat affiche alors la couleur en rgba() et hsla(), prête à copier. Si tu saisis une valeur avec un canal alpha, comme un code HEX à 4 ou 8 caractères (#rrggbbaa), rgba() ou hsla(), le curseur reprend cette opacité dès que tu quittes le champ. Le code HEX du résultat reste à six caractères.

Il mesure, de 1:1 à 21:1, à quel point deux couleurs, comme le texte et l’arrière-plan, se distinguent. Niveaux de l’outil : AAA à partir de 7:1, AA à partir de 4.5:1 pour le texte normal et AA (grand texte) à partir de 3:1 pour les caractères grands ou gras. Le Color Picker affiche le rapport entre ta couleur et le noir ou le blanc. Pour comparer d’autres couleurs de texte et d’arrière-plan, utilise le Contrast Checker. Accéder au Contrast Checker

À côté du champ coloré, l’outil affiche la couleur CSS la plus proche. Il calcule pour cela la distance euclidienne entre ta couleur et chaque couleur CSS nommée dans l’espace RGB, puis indique la plus proche, par exemple tomato pour #ff6347. Si la correspondance n’est pas exacte, la mention « similaire » apparaît. Tu peux copier ce nom et l’utiliser en CSS à la place du code HEX, mais « similaire » indique une approximation.