Code couleur : HEX, RGB, HSL et CMJN
Choisissez une couleur ou collez un code (#3b82f6, rgb(59,130,246), hsl(217,91%,60%)) pour obtenir toutes ses notations et vérifier son contraste.
Comprendre les codes couleur
HEX (hexadécimal)
Le format #RRVVBB code le rouge, le vert et le bleu sur deux chiffres hexadécimaux chacun (de 00 à FF, soit 0 à 255). #FF0000 est un rouge pur. La forme courte #F00 est équivalente. C'est la notation la plus utilisée en CSS et dans les logiciels de design.
RGB
rgb(255, 0, 0) donne les mêmes trois composantes en décimal. Il existe 256 × 256 × 256 = 16 777 216 combinaisons possibles.
HSL
hsl(teinte, saturation, luminosité) décrit une couleur de façon plus intuitive : la teinte est un angle sur le cercle chromatique (0° rouge, 120° vert, 240° bleu), la saturation et la luminosité sont des pourcentages. Pratique pour créer des variantes plus claires ou plus foncées d'une même couleur.
CMJN
Le CMJN (cyan, magenta, jaune, noir) est utilisé en impression. La conversion affichée ici est une approximation mathématique : pour un document imprimé, utilisez le profil ICC fourni par votre imprimeur.
Codes des couleurs courantes
| Couleur | HEX | RGB |
|---|---|---|
| Rouge | #FF0000 | rgb(255, 0, 0) |
| Vert | #008000 | rgb(0, 128, 0) |
| Bleu | #0000FF | rgb(0, 0, 255) |
| Jaune | #FFFF00 | rgb(255, 255, 0) |
| Orange | #FFA500 | rgb(255, 165, 0) |
| Violet | #800080 | rgb(128, 0, 128) |
| Rose | #FFC0CB | rgb(255, 192, 203) |
| Marron | #A52A2A | rgb(165, 42, 42) |
| Noir | #000000 | rgb(0, 0, 0) |
| Blanc | #FFFFFF | rgb(255, 255, 255) |
| Gris | #808080 | rgb(128, 128, 128) |
| Cyan | #00FFFF | rgb(0, 255, 255) |
| Magenta | #FF00FF | rgb(255, 0, 255) |
| Bleu marine | #000080 | rgb(0, 0, 128) |
| Bordeaux (maroon) | #800000 | rgb(128, 0, 0) |
| Turquoise | #40E0D0 | rgb(64, 224, 208) |
| Beige | #F5F5DC | rgb(245, 245, 220) |
| Or (gold) | #FFD700 | rgb(255, 215, 0) |
| Argent (silver) | #C0C0C0 | rgb(192, 192, 192) |
| Vert olive | #808000 | rgb(128, 128, 0) |
Contraste et accessibilité
Les règles d'accessibilité WCAG 2.1 demandent un rapport de contraste d'au moins 4,5:1 pour le texte courant (niveau AA), 3:1 pour le grand texte, et 7:1 pour le niveau AAA. L'outil calcule ce rapport pour un texte blanc et un texte noir posés sur la couleur choisie.
Outils associés
Questions fréquentes
Comment convertir un code HEX en RGB ?
Découpez le code en trois paires et convertissez chacune de l'hexadécimal vers le décimal : #3B82F6 donne 3B = 59, 82 = 130, F6 = 246, soit rgb(59, 130, 246). L'outil le fait automatiquement.
Quel est le code couleur du rouge ?
Le rouge pur s'écrit #FF0000 en hexadécimal, rgb(255, 0, 0) en RGB et hsl(0, 100%, 50%) en HSL.
Quelle différence entre RGB et CMJN ?
Le RGB est un modèle additif pour les écrans (la lumière s'additionne jusqu'au blanc). Le CMJN est un modèle soustractif pour l'impression (les encres s'additionnent vers le noir). Certaines couleurs vives à l'écran ne sont pas imprimables à l'identique.
Comment savoir si mon texte est assez lisible ?
Vérifiez le rapport de contraste entre le texte et le fond : au moins 4,5:1 pour du texte courant selon les WCAG 2.1 (niveau AA). L'outil l'indique pour un texte blanc et un texte noir.