Dans cet article
Les formats de couleur expliqués
Les couleurs en design numérique et développement web sont représentées dans plusieurs formats adaptés à différents contextes. HEX (#ff5733) est concis et universel pour le web. RGB (255, 87, 51) est intuitif pour mélanger les couleurs. HSL (14°, 100%, 60%) est le plus lisible pour ajuster la teinte, la saturation et la luminosité.
Différents outils utilisent différents formats de couleur — les logiciels de design préfèrent souvent HSL, HTML/CSS utilise HEX et RGB, les bibliothèques de couleurs JavaScript peuvent utiliser divers formats, et le design print utilise CMYK. Convertir entre eux avec précision nécessite des formules mathématiques.
Comment fonctionne la conversion de couleur
Le convertisseur applique des transformations mathématiques précises entre les espaces colorimétriques.
- Analyse HEX — décode les codes hex à 3 et 6 chiffres, avec ou sans canal alpha
- Normalisation RGB — gère les valeurs entières 0-255 et les représentations en virgule flottante 0-1
- Calcul HSL — convertit vers/depuis la teinte (0-360°), la saturation (0-100%) et la luminosité (0-100%)
Essayez gratuitement — sans inscription
Convertir une couleur →Quand utiliser la conversion de couleur
La conversion de couleur est nécessaire chaque fois que des couleurs passent entre différents outils, formats ou contextes.
- Design vers code — convertissez les valeurs de couleur HSL de Figma/Sketch en HEX pour l'implémentation CSS
- Cohérence de marque — vérifiez que les valeurs de couleur correspondent entre différents outils de design et implémentations de code
- Accessibilité — calculez les ratios de contraste (qui utilisent la luminance relative à partir des valeurs RGB) pour la conformité WCAG
Questions fréquentes
Quelle est la différence entre RGB et RGBA ?
RGBA ajoute un canal alpha à RGB, représentant l'opacité de 0 (totalement transparent) à 1 (totalement opaque), ou de 0 à 255 selon le contexte. De même, HEXA ajoute deux chiffres hexadécimaux pour l'alpha (par exemple, #FF5733FF pour totalement opaque ou #FF573380 pour 50% d'opacité). Les valeurs alpha permettent les couleurs transparentes et semi-transparentes.
Pourquoi la conversion d'une couleur dans un sens puis dans l'autre ne retourne-t-elle pas toujours la valeur exacte d'origine ?
La conversion entre espaces colorimétriques implique de l'arithmétique en virgule flottante et des arrondis. Les conversions aller-retour (RGB → HSL → RGB) peuvent présenter de légères erreurs d'arrondi sur le dernier chiffre. C'est normal et la différence est imperceptible à l'œil humain. Pour un travail nécessitant de la précision, stockez toujours les couleurs dans un seul format canonique.
Quelle est la différence entre HSL et HSV/HSB ?
HSL (Teinte, Saturation, Luminosité) et HSV/HSB (Teinte, Saturation, Valeur/Luminance) sont des modèles colorimétriques cylindriques différents. En HSL, le blanc pur correspond à L=100% quelle que soit la saturation ; en HSV, le blanc pur correspond à S=0%, V=100%. HSL est plus intuitif pour le design web ; HSV est couramment utilisé dans les interfaces de sélecteur de couleur.