Aller au contenu principal
ToolsByUs

Convertir RGB en HEX

Convertisseur RGB en HEX transforme trois canaux décimaux en couleur hexadécimale. Chaque canal est divisé par 16 : le quotient est le premier chiffre hexadécimal, le reste le second ; 136 devient 88 et 255 devient ff. Une valeur alpha est ajoutée en quatrième paire, arrondie à la plus proche des 256 marches — c’est le seul endroit où l’aller-retour n’est pas exact.

100 % local
Entrée RGB

Saisissez une couleur à gauche. Les valeurs hexadécimales avec ou sans dièse sont acceptées, rgb(), hsl(), oklch() ainsi que les noms de couleurs CSS.

Comment fonctionne Convertir RGB en HEX ?

Chaque canal est un nombre entier de 0 à 255, et deux chiffres hexadécimaux couvrent exactement cette plage. Divisez par 16 : le quotient est le premier chiffre, le reste le second. 136 ÷ 16 donne 8 reste 8, soit 88. 255 ÷ 16 donne 15 reste 15, et 15 s’écrit f, donc ff.

Les canaux à un chiffre réclament le zéro de tête

Un canal inférieur à 16 produit un seul chiffre, et supprimer le zéro décale tous les chiffres qui suivent. rgb(255 8 0) donne #ff0800, pas #ff800 — qui fait cinq chiffres et n’est pas une couleur du tout. C’est le bug classique d’un convertisseur écrit à la main, et il n’apparaît que sur les couleurs foncées, celles que personne ne regarde.

Ce que devient un canal non entier

CSS autorise rgb(255.6 136 0), et l’hexadécimal ne peut pas contenir de fraction. La valeur est arrondie à l’entier le plus proche, ce que fait aussi le navigateur. Si vos canaux sortent d’un calcul — une couleur éclaircie, une étape interpolée — l’hex que vous récupérez est la version arrondie, et le reconvertir vers rgb ne rendra pas la fraction de départ.

L’alpha, et la seule étape avec perte

Un alpha de 0.5 devient 80, car 0.5 × 255 fait 127.5, arrondi à 128. Reconverti, cela donne 0.502. Chaque canal de couleur fait un aller-retour exact ; l’alpha non, parce que c’est une fraction stockée en 256 marches. L’écart est très en dessous de tout ce qui est visible, et il apparaît dès que vous comparez deux chaînes dans un test.

Les pourcentages

rgb(100% 53.3% 0%) est la même couleur que rgb(255 136 0) : les pourcentages dans rgb() se calculent sur 255, pas sur 100. Cela piège ceux qui convertissent depuis un outil de design qui exporte des valeurs 0–100, où 53% veut dire 135, pas 53.

Canaux RGB

rgb(255 136 0)

La couleur hexadécimale

#ff8800

255 → ff   (15 × 16 + 15)
136 → 88   (8 × 16 + 8)
  0 → 00   (0 × 16 + 0)

Quelles options et quels cas limites Convertir RGB en HEX prend en charge ?

Référence technique et options
ParamètreTypeValeur par défautComportement et cas limites
0canal00Le minimum. Les deux chiffres sont zéro.
8canal08Inférieur à 16, donc le zéro initial est obligatoire. Le supprimer corrompt toute la valeur.
128canal80Le point milieu, et exactement 8 × 16.
136canal888 × 16 + 8.
255canalffLe maximum. 15 × 16 + 15.
alpha 0.5fraction80127.5 est arrondi à 128. La conversion inverse donne 0.502 — la seule étape de cette conversion qui n’est pas exacte.
255.6non entierffArrondi, comme le fait le navigateur. Une composante fractionnaire ne survit pas en hex.
100%pourcentage255Les pourcentages sont résolus par rapport à 255. 53% donne 135, pas 53.

Questions fréquentes

Comment convertir du RGB en hexadécimal à la main ?

Divisez chaque canal par 16. Le quotient donne le premier chiffre, le reste le second, avec 10–15 écrits a–f. 136 ÷ 16 = 8 reste 8, soit 88. Écrivez les trois paires dans l’ordre — rouge, vert, bleu — avec un # devant. Le seul piège, c’est un canal inférieur à 16 : il doit quand même tenir sur deux chiffres, donc 8 s’écrit 08, pas 8.

Pourquoi ma couleur hexadécimale fait-elle cinq chiffres ?

Un canal inférieur à 16 a perdu son zéro de tête. rgb(255 8 0) donne #ff0800 ; écrit #ff800, cela fait cinq caractères, ce qui n’est pas une couleur hexadécimale valide et les navigateurs ignoreront toute la déclaration. C’est le bug le plus courant du code de conversion écrit à la main, et il n’apparaît que sur les couleurs foncées.

Convertir du RGB en hexadécimal perd-il de l’information de couleur ?

Non, pour la couleur elle-même — les deux notations portent les mêmes trois octets, donc l’aller-retour est exact. L’alpha est l’exception : c’est une fraction en CSS et l’hexadécimal la stocke en 256 marches, si bien que 0.5 devient 80 et revient en 0.502. Invisible à l’écran, visible dans une comparaison de chaînes.

Que donne rgb(100% 50% 0%) ?

#ff8000. Les pourcentages dans rgb() sont des fractions de 255, pas de 100, donc 50% fait 127.5, arrondi à 128 — soit 80 en hexadécimal. Si un outil de design exporte ces nombres comme des valeurs 0–100, ils veulent dire autre chose, et cet écart mérite d’être vérifié avant de coller.

Faut-il écrire rgba() ou utiliser un hexadécimal à 8 chiffres ?

Les deux ; l’un comme l’autre est pris en charge partout actuellement. L’hexadécimal à 8 chiffres est plus compact et garde toute la couleur dans un seul token, ce qui convient aux design tokens et aux variables. rgba() est plus lisible et plus facile à éditer à la main, et c’est ce que contient déjà la plupart des feuilles de style existantes. Le seul vrai argument, c’est la cohérence avec le code alentour.

Pourquoi le hex d’un designer ne correspond-il pas au RGB que ma pipette d’écran indique ?

La gestion des couleurs. Une pipette d’écran échantillonne les pixels après application du profil d’affichage, si bien qu’un écran à gamut étendu donne des nombres différents pour la même couleur source sRGB. Prélevez depuis le fichier de design plutôt que depuis une capture d’écran, ou réglez la pipette sur sRGB, et les deux se remettent d’accord.

Équipe ToolsByUs · Comment nous vérifions nos outils