Qu'est-ce que Sélecteur de Couleur ?

Choisissez visuellement n'importe quelle couleur et récupérez ses valeurs hex, RGB et HSL. Cliquez ou glissez pour trouver la bonne teinte, puis copiez le code.

Faites glisser dans le carré saturation/luminosité pour changer la nuance, déplacez la barre de teinte pour passer de famille de couleur, et l'outil renvoie hex, RGB et HSL prêts à copier d'un clic. Si vous tapez un hex dans le champ, le carré saute au bon endroit, parfait pour retoucher une couleur de marque sans repartir d'une teinte aléatoire.

Comment utiliser

1. Cliquez sur la zone de couleur ou faites glisser le sélecteur
2. Affinez avec le curseur de teinte et le contrôle d'opacité
3. Copiez la valeur hex, RGB ou HSL en un clic

Quand l'utiliser

• Choisir des couleurs d'accent pour le CSS d'un site sans ouvrir de logiciel de design.
• Convertir un hex du manuel de marque en HSL pour un design system.
• Bâtir une mini-palette de tons voisins en déplaçant le curseur de teinte.

Résultat

Sélectionnez un orange chaud : #E67E22, rgb(230, 126, 34), hsl(28, 80%, 52%).

FAQ

Quelle est la différence entre HSL et HSB (HSV) ?

HSL va du noir au blanc en passant par la couleur pure à 50% de luminosité, pratique pour des teintes et ombres symétriques. HSB (utilisé par Photoshop) va du noir à la couleur pure à 100% de luminance, plus proche de la logique d'un mélangeur de peinture.

Pourquoi mes couleurs à l'écran diffèrent-elles de l'impression ?

L'écran utilise le RGB (lumière additive), l'imprimerie le CMJN (encre soustractive). Les verts vifs et les bleus électriques surtout n'ont pas d'équivalent CMJN exact. Demandez toujours un bon à tirer sur le support cible avant validation.

Les codes hex respectent-ils WCAG par défaut ?

Non, l'accessibilité dépend de la paire de couleurs, pas d'une couleur seule. Combinez votre hex de premier plan avec celui du fond et vérifiez le contraste : 4,5:1 minimum pour le corps de texte, 3:1 pour les grandes tailles.

Comment capturer une couleur déjà présente à l'écran ?

Cliquez sur Capturer à l'écran et la pipette vous laisse échantillonner n'importe quel pixel de votre écran : le hex exact arrive directement dans le sélecteur pour ajuster saturation, luminosité ou transparence. (Le bouton pipette n'apparaît que là où c'est pris en charge ; sinon, lisez le hex avec la sonde de couleur de votre système — Digital Color Meter sur macOS, PowerToys sous Windows, DevTools de Chrome — et collez-le dans le champ de saisie.)

Le sélecteur gère-t-il la transparence ?

Oui. Sous la barre de teinte, un curseur Opacité règle l'alpha de 0 à 100 %. La vignette d'aperçu affiche un damier derrière la couleur pour visualiser le niveau de transparence d'un coup d'œil, et les boutons de copie RGB et HSL passent automatiquement à rgba() et hsla() dès que l'alpha descend sous 100 %.

Outils similaires