ColorPicker convertit les couleurs entre tous les formats courants et affiche toutes les valeurs dont un développeur a besoin : rapports de contraste, niveaux WCAG, luminance relative, noms CSS et du code prêt à copier. Tout s'exécute dans votre navigateur - aucune donnée n'est envoyée à un serveur.
Le carré choisit la saturation et la luminosité, le curseur de teinte la famille de couleurs et le curseur alpha la transparence. Un clic sur un échantillon, un préréglage ou une couleur récente la charge. Le petit bouton coloré à côté du champ ouvre le sélecteur du système.
Le champ comprend #4f8cff, #4f8c, #4f8cff80, rgb(79, 140, 255), rgba(79, 140, 255, 0.5), hsl(217, 100%, 65%), hsv(...), hwb(...), cmyk(...), lab(...), lch(...), oklab(...), oklch(...) et tous les noms CSS comme rebeccapurple. Le HEX court à trois ou quatre chiffres fonctionne aussi.
Le tableau Formats liste la couleur en HEX, HEXA, RGB(A), HSL(A), HSV, HWB, CMYK, LAB, LCH, OKLAB, OKLCH ainsi que des extraits pour Tailwind, Swift et Android. Chaque ligne a un bouton de copie et Tout copier met toute la liste dans le presse-papiers.
La section Contraste affiche le rapport WCAG 2.2 avec le blanc et le noir purs, marqué AAA (7:1), AA (4,5:1), AA18 (3:1, grands textes seulement) ou fail. Les valeurs APCA (Lc) montrent le modèle perceptif moderne qui doit remplacer les anciens rapports dans WCAG 3. L'application indique aussi la meilleure couleur de texte lisible sur un fond.
Informations couleur affiche HSL, HSV, OKLCH, la luminance relative en pourcentage, le nom CSS exact si la valeur correspond à l'un d'eux, et la couleur CSS nommée la plus proche avec la distance Lab.
Harmonies de couleurs dérive les variantes complémentaires, triadiques, analogues, complémentaires divisées, tétradiques et monochromes. Nuances et teintes construit une gamme de luminosité de 95% à 0%, et les variantes mélangées mélangent la couleur avec du blanc ou du noir. Chaque échantillon est cliquable.