Les codes couleur hexadécimaux expliqués
Par MICKAEL GOMES CONSULTING · Dernière mise à jour: 2026-06-19
Un code couleur hexadécimal est un nombre hexa à six chiffres, généralement écrit avec un dièse en tête comme #FF8800, qui définit une couleur par ses composantes rouge, verte et bleue. Les six chiffres se répartissent en trois paires : la première paire règle le canal rouge, la deuxième le vert et la troisième le bleu. Chaque paire va de 00 à FF, soit de zéro à 255 ; un code couleur hexa n’est donc que trois valeurs d’octet regroupées dans une chaîne compacte.
Lire les trois canaux
Prenons #FF8800. La paire rouge est FF, soit 255, le maximum : le rouge est donc à fond. La paire verte est 88, soit 136, un peu plus de la moitié de l’intensité. La paire bleue est 00, soit zéro : le bleu est éteint. Rouge à fond, plus vert modéré, plus aucun bleu, cela produit un orange chaud. Mélanger les trois canaux à différentes intensités est la façon dont chaque couleur d’un écran est construite.
Deux repères simples aident à lire un code d’un coup d’œil. #000000 correspond à tous les canaux éteints, soit le noir, et #FFFFFF à tous les canaux au maximum, soit le blanc. Un code où le rouge, le vert et le bleu sont égaux, comme #808080, est toujours une nuance de gris.
Formes abrégées et codes à huit chiffres
Le CSS accepte aussi une forme abrégée à trois chiffres où chaque chiffre est doublé. #F90 se développe en #FF9900 ; l’abrégé n’est donc valide que lorsque chaque paire de canal est faite de deux caractères identiques. La règle de développement est simplement que chaque chiffre est répété : le F devient FF, le 9 devient 99 et le 0 devient 00. Un code comme #f80 vaut donc exactement #ff8800, tandis qu’une couleur telle que #FE8 n’a pas d’abrégé valide, car ses paires ne sont pas faites de caractères identiques.
Au-delà des six chiffres classiques, le CSS moderne prend en charge une forme à huit chiffres, #RRVVBBAA, où la dernière paire est une valeur alpha qui contrôle l’opacité. Un AA de FF est totalement opaque et 00 totalement transparent, si bien que #FF880080 est le même orange à environ moitié de transparence. Il existe aussi un abrégé à quatre chiffres, #RVBA, qui double chaque chiffre comme la forme à trois chiffres : #F808 se développe donc en #FF880088.
Hexa contre notation rgb()
Les codes hexa et la fonction CSS rgb() décrivent les mêmes couleurs ; ce sont deux notations pour des valeurs de canaux identiques. #FF8800 et rgb(255, 136, 0) affichent le même orange. Les designers préfèrent souvent l’hexa pour sa concision, tandis que rgb() peut être plus facile à ajuster canal par canal. La conversion entre les deux est purement mécanique : chaque canal rgb est une paire hexa, et un convertisseur effectue le calcul instantanément dans un sens comme dans l’autre.
Couleurs nommées et mots-clés
Le CSS reconnaît environ 140 couleurs nommées, comme red, orange ou rebeccapurple, et chacune n’est qu’un alias commode d’une valeur hexa précise. Le mot-clé red est identique à #FF0000, white à #FFFFFF et black à #000000. Les noms sont pratiques pour prototyper vite, mais un code hexa vous donne accès à la gamme complète de plus de seize millions de couleurs plutôt qu’à une liste fixe et limitée, ce qui explique pourquoi les feuilles de style de production s’appuient sur l’hexa une fois la palette arrêtée.
Un mot-clé particulier, currentColor, n’est pas du tout une valeur fixe : il prend la couleur de texte actuelle de l’élément. L’associer à une valeur hexa définie ailleurs permet aux bordures, icônes et arrière-plans de suivre automatiquement la couleur du texte. Que vous choisissiez un nom, un mot-clé ou un code hexa brut, le navigateur ramène finalement chacun aux mêmes valeurs de canaux rouge, vert et bleu décrites plus haut.