Convertisseur de codes couleur

À propos de l’outil Convertisseur de codes couleur

Le convertisseur de codes couleur transforme une couleur dans les trois formats web courants : HEX (#FF8800), RGB (rgb(255, 136, 0)) et HSL (hsl(32, 100%, 50%)). Saisissez un code dans l’un d’eux, ou choisissez une couleur, et copiez le format dont vous avez besoin pour le CSS, un outil de design ou du code.

Il vérifie aussi le contraste. Saisissez une couleur de texte et une couleur de fond pour voir leur rapport de contraste WCAG et savoir si elles respectent les niveaux AA et AAA pour le texte normal et le grand texte, afin que votre texte reste lisible pour tous.

Tout s’exécute dans votre navigateur ; rien de ce que vous saisissez n’est envoyé.

Mode d’emploi

1. Saisissez un code couleur comme #777, rgb(0 128 255) ou hsl(120, 50%, 50%), ou utilisez le sélecteur de couleur.
2. Lisez la couleur en HEX, RGB et HSL à côté de son aperçu.
3. Cliquez sur Copier à côté du format voulu.
4. Pour le contraste, saisissez une couleur de texte (ou laissez vide pour utiliser la couleur ci-dessus) et une couleur de fond.
5. Lisez le rapport de contraste et les résultats AA et AAA pour le texte normal et le grand texte.

Fonctionnalités

• HEX, RGB et HSL: Lit le HEX court et long, rgb() et hsl() avec des virgules ou des espaces, ainsi que trois nombres simples.
• Sélecteur de couleur: Choisissez une couleur visuellement et obtenez aussitôt ses codes.
• Rapport de contraste: Le rapport de contraste WCAG 2 de deux couleurs quelconques, de 1:1 à 21:1.
• AA et AAA: Conforme ou non conforme pour le texte normal et le grand texte, aux deux niveaux.
• Erreurs claires: Indique quelle partie d’un code est incorrecte, par exemple une valeur de rouge supérieure à 255.

Exemples

Limites et remarques

• Les couleurs avec transparence (alpha), comme #FF000080 ou rgba(), ne sont pas prises en charge.
• Les noms de couleurs (red, blue), le CMJN, le LAB et les autres espaces colorimétriques ne sont pas convertis.
• Les valeurs HSL sont arrondies à l’entier, si bien qu’une conversion retour peut décaler un canal de quelques unités.
• La vérification du contraste suit les WCAG 2.x ; elle ne juge ni l’épaisseur de la police, ni la taille, ni le daltonisme à votre place.

Questions fréquentes