Que signifient réellement les six caractères d'une couleur hex ?

Ce sont trois paires, une pour le rouge, une pour le vert et une pour le bleu. Les deux premiers caractères fixent la quantité de rouge, les deux suivants le vert, les deux derniers le bleu. Chaque paire est un nombre de 0 à 255 écrit en base 16, donc les six caractères réunis décrivent une couleur exacte.

Pourquoi chaque paire monte-t-elle jusqu'à 255 et non 99 ?

Le hex est en base 16, pas en base 10, donc chaque caractère contient 16 valeurs, de 0 à 9 puis de A à F. Deux caractères ensemble couvrent 16 fois 16, soit 256 valeurs, de 0 à 255. Cette plage correspond à la façon dont chaque canal de couleur est stocké, et c'est pourquoi une paire culmine à FF, pas à 99.

Un code hex donne-t-il la même couleur que sa valeur rgb() ?

Oui. Ce sont deux manières d'écrire les mêmes trois nombres. #FF5733 vaut rouge 255, vert 87, bleu 51, ce qui est exactement rgb(255, 87, 51). Le hex regroupe les valeurs en paires de base 16, rgb() les écrit en toutes lettres en base 10. Le pixel allumé est identique dans les deux cas.

À quoi sert la paire supplémentaire dans un code hex à 8 chiffres ?

C'est le canal alpha, qui règle la transparence. Les six premiers caractères sont le rouge, le vert et le bleu habituels. Les deux derniers vont de 00, totalement transparent, à FF, totalement opaque, dans la même plage de 0 à 255. Ainsi #FF5733CC est ce rouge orangé à environ 80 pour cent d'opacité.

Comment fonctionnent les codes couleur hex (et ce que signifie vraiment #FF5733)

Un code couleur hex regroupe trois nombres, rouge, vert et bleu, en six caractères. Chaque paire va de 0 à 255 en base 16. Une fois que vous voyez #FF5733 comme 255, 87, 51, la notation cesse d'être un mystère.

Une couleur comme #FF5733 ressemble à un code que vous êtes censé copier sans jamais le comprendre. Ce n’est pas un code en ce sens. Ce sont trois nombres tout simples sous un déguisement compact, et dès que vous savez redécomposer les six caractères en rouge, vert et bleu, chaque couleur hex que vous croisez devient lisible. L’astuce, c’est de comprendre que le hex consiste juste à compter en base 16.

En bref : un code couleur hex, ce sont trois nombres, rouge, vert et bleu, chacun de 0 à 255, écrits en base 16 sous forme de deux caractères chacun. #FF5733 vaut rouge 255, vert 87, bleu 51, la même couleur que rgb(255, 87, 51). Un code court #FFF se développe en #FFFFFF, et une paire supplémentaire à la fin règle la transparence.

Ce que sont vraiment les six caractères d’un code hex

Une couleur hex, ce sont trois nombres collés ensemble, un pour le rouge, un pour le vert, un pour le bleu. Les six caractères après le # se divisent en trois paires : la première paire est le rouge, la deuxième le vert, la troisième le bleu. Chaque paire est une valeur unique de 0 à 255 qui indique la quantité de ce canal à mélanger. C’est toute la structure.

Donc #FF5733 n’est pas un seul long nombre. C’est FF pour le rouge, 57 pour le vert, 33 pour le bleu, trois quantités distinctes lues de gauche à droite. Les écrans construisent chaque couleur en mélangeant ces trois canaux de lumière, et le code hex est simplement une façon nette de noter les trois niveaux en six caractères plutôt que de les écrire en toutes lettres.

Pourquoi chaque paire va de 0 à 255 en base 16

Hex est l’abréviation d’hexadécimal, ce qui veut dire compter en base 16 au lieu de la base 10 que nous utilisons par défaut. Un seul caractère hex contient 16 valeurs : 0 à 9, puis A, B, C, D, E, F qui représentent 10 à 15. Deux caractères ensemble couvrent 16 fois 16, soit 256 valeurs possibles, comptées de 0 jusqu’à 255. C’est de là que vient la plage du canal.

Voilà pourquoi une paire culmine à FF et non à 99. En base 10, FF revient à 15 fois 16 plus 15, soit 255, le maximum. La plus petite valeur est 00, c’est-à-dire 0. Chaque canal se situe quelque part dans cette plage de 256 paliers, et deux caractères hex suffisent exactement pour écrire n’importe quelle valeur sans gaspillage. Un seul caractère n’atteindrait que 15, trois caractères en feraient trop.

Comment décomposer #FF5733 en rouge, vert et bleu

Prenez #FF5733 et séparez-le en ses trois paires pour voir la couleur réelle. FF est le canal rouge, et FF vaut 255, le maximum, donc cette couleur est entièrement rouge. 57 est le canal vert, soit 87 en base 10, une quantité faible à moyenne. 33 est le canal bleu, soit 51, faible également. Beaucoup de rouge, un peu de vert, un peu moins de bleu, mélangés, donnent un rouge orangé chaud.

Le calcul est le même pour n’importe quelle paire. Le premier caractère vaut sa valeur fois 16, et vous ajoutez la valeur du second caractère. Pour 57, le 5 fait 5 fois 16, soit 80, plus le 7, ce qui donne 87. Pour 33, le 3 fait 3 fois 16, soit 48, plus 3, ce qui donne 51. Vous avez rarement besoin de le faire à la main, mais le faire une fois rend la notation évidente. Si vous préférez construire et lire des palettes entières plutôt que de convertir des paires de tête, le générateur de palettes sur color.hivly.net affiche le hex et les valeurs de canal côte à côte.

Pourquoi hex et rgb() donnent la même couleur

Un code hex et une valeur rgb() sont deux notations pour un même jeu de nombres. #FF5733 et rgb(255, 87, 51) décrivent le pixel identique. Le hex écrit les trois canaux en base 16 et les regroupe de façon serrée ; rgb() écrit les mêmes trois canaux en base 10 ordinaire et les sépare par des virgules. Aucun n’est plus « réel » que l’autre. Ils se convertissent l’un en l’autre à l’identique.

Vous verrez les deux en CSS, et celui qui apparaît tient surtout à l’habitude et au contexte. Le hex est compact et facile à coller depuis un outil de design, donc il domine les feuilles de style. La forme rgb() est plus facile à lire pour un humain d’un coup d’œil et rend évident le moment où vous voulez ajuster un seul canal. Choisissez celle qui vous paraît la plus claire sur l’instant. Le navigateur les traite comme la même instruction.

La forme abrégée et les formes alpha

Le hex a deux variantes au-delà de la forme à six caractères. La version courte utilise trois caractères, et chacun est simplement doublé pour former une paire. #FFF se développe en #FFFFFF, c’est-à-dire le blanc ; #F00 se développe en #FF0000, le rouge pur. L’abréviation ne fonctionne que lorsque les deux caractères de chaque paire sont identiques, donc #FF5733 n’a pas de version à trois caractères. C’est une commodité pour les valeurs rondes, pas un système différent.

La variante plus longue ajoute une quatrième paire pour la transparence, appelée canal alpha. Un code à huit caractères comme #FF5733CC garde les mêmes rouge, vert et bleu, puis utilise la paire finale, CC, pour régler l’opacité sur la même échelle de 0 à 255. 00 est totalement transparent, FF est totalement opaque, et CC vaut 204, soit environ 80 pour cent. Ainsi #FF5733CC est ce rouge orangé, presque plein mais laissant passer un peu d’arrière-plan. L’abréviation à quatre caractères, comme #FFFA, double chaque caractère de la même manière.

Lire un code hex d’un coup d’œil

Vous pouvez lire la plupart des codes hex sans aucune conversion dès que vous en connaissez la disposition. Regardez la première paire pour le rouge, la paire du milieu pour le vert, la dernière pour le bleu, et jugez chaque paire selon sa hauteur. Une paire proche de FF signifie beaucoup de ce canal ; une paire proche de 00 signifie presque rien. #FF5733 se lit instantanément comme rouge élevé, vert faible, bleu faible, donc chaud et rougeâtre avant même de calculer une seule valeur.

Cette lecture rapide est là où le hex prouve son utilité, et aussi là où il cesse de suffire. Les nombres correspondent proprement à la façon dont un écran mélange la lumière, mais ils ne reflètent pas la façon dont l’œil perçoit la luminosité ni la façon dont nous pensons une couleur avec des mots. Deux codes peuvent différer de la même quantité sur le papier tout en paraissant radicalement différents. Quand vous devez raisonner sur la clarté, la saturation ou l’uniformité perceptive, des formats comme HSL ou OKLCH décrivent une couleur telle que les gens la voient vraiment, tandis que le hex reste la façon compacte de stocker et de coller le mélange exact.