Qu’est-ce qu’un sélecteur de couleurs ?

Un sélecteur de couleurs vous permet de choisir une couleur à l’œil plutôt que de saisir des nombres. La plupart des applications de conception présentent les couleurs de la même manière : un curseur de teinte permet de choisir la couleur de base dans l’arc-en-ciel, et un carré à côté permet de régler la quantité de cette teinte (la saturation, de gauche à droite) et sa luminosité (de haut en bas). Cette disposition correspond au modèle de couleurs HSV, dans lequel se trouve chaque couleur qu’un écran peut afficher.

Description de l’outil

Faites glisser le curseur dans le carré et sur le curseur de teinte pour trouver une couleur, ou saisissez ou collez une couleur existante au format HEX, RGB, HSL ou dans un autre format. Dans Chrome et Edge, le bouton de la pipette permet de sélectionner une couleur n’importe où sur votre écran, même en dehors du navigateur. Réglez l’opacité pour obtenir des couleurs transparentes, puis copiez le résultat dans le format souhaité : HEX pour CSS et la plupart des outils de conception, RGB et HSL pour CSS, HSV pour les applications de conception, OKLCH pour le CSS moderne et CMYK comme point de départ pour l’impression.

Fonctionnalités

  • Carré de saturation et de luminosité avec curseur de teinte, utilisable à la souris, au toucher ou au clavier
  • Pipette de sélection à l’écran dans Chrome et Edge
  • Saisie ou collage d’une couleur aux formats HEX, RGB, HSL, HWB, CMYK et dans d’autres formats
  • Opacité affichée sur un quadrillage de transparence
  • Valeurs HEX, RGB, HSL, HSV, OKLCH et CMYK, chacune prête à être copiée
  • Autres formats, tels que HWB, LAB, LCH et XYZ, dans la liste des formats de la couleur sélectionnée
  • Fonctionne dans votre navigateur

Fonctionnement

L’outil conserve la couleur sous forme de teinte, de saturation et de valeur. Ainsi, la teinte ne change pas lorsque vous faites glisser le curseur vers le blanc, le noir ou le gris. Les autres formats sont calculés à partir de ces valeurs : HEX et RGB sont arrondis à des nombres entiers de 0 à 255, HSL et HSV à des degrés et des pourcentages entiers, et OKLCH est converti via l’espace colorimétrique sRGB. Lorsque l’opacité est inférieure à 100 %, HEX reçoit une quatrième paire de chiffres et les formats CSS une valeur alpha. CMYK ne prend pas en charge l’alpha et utilise une conversion simple, sans profil d’imprimante.

Conseils

  • L’opacité propre à une couleur collée, comme dans rgba(), n’est pas conservée : réglez-la avec le champ Opacité.
  • Cliquez sur le carré ou le curseur, puis utilisez les touches fléchées pour avancer par incréments de 1 %, ou de 10 % en maintenant Maj.
  • Pour extraire les couleurs d’une photo ou d’une capture d’écran, utilisez le sélecteur de couleurs d’image, qui analyse directement l’image.
  • Demandez à votre imprimeur quelles valeurs CMYK utiliser : une même couleur peut être imprimée différemment selon les presses et les papiers.