Convertisseur
de couleur
en ligne.
Convertissez instantanement entre HEX, RGB, HSL, HSV, CMJN, decimal et noms CSS. Apercu en temps reel et ratio de contraste WCAG.
#F00, #FF0000, #FF0000FF (avec alpha)rgb(255,0,0), rgba(255,0,0,0.5)hsl(0,100%,50%), hsla(0,100%,50%,0.5)hsv(0,100%,100%) — CMYK : cmyk(0%,100%,100%,0%)red, dodgerblue, rebeccapurple — Decimal : 16711680ou votre identite visuelle ? Contactez-nous
Comprendre les formats de couleur
HEX et RGB : les incontournables
Le format HEX (#FF0000) est le plus utilise en CSS et dans les outils de design. Il represente les composantes Rouge, Vert, Bleu en hexadecimal. Le RGB (rgb(255,0,0)) exprime les memes valeurs en decimal, de 0 a 255. Les deux formats couvrent le meme gamut et sont interchangeables.
HSL : pensez en teinte et luminosite
HSL (Hue, Saturation, Lightness) est le format le plus intuitif pour les designers. La teinte est un angle de 0 a 360 degres sur le cercle chromatique, la saturation et la luminosite sont des pourcentages. Modifier la luminosite seule permet de creer facilement des variantes claires et sombres d'une meme teinte.
HSV et CMYK : outils pros
HSV (Hue, Saturation, Value) est le modele utilise par Photoshop, Figma et la plupart des color pickers. CMYK (Cyan, Magenta, Yellow, Key/Black) est le standard de l'impression. La conversion RGB vers CMYK est approximative car les deux espaces couleur ne couvrent pas le meme gamut.
Ratio de contraste WCAG
Le ratio de contraste mesure la lisibilite d'une couleur sur un fond donne. Les normes WCAG 2.1 exigent un ratio minimum de 4.5:1 pour le texte normal (AA) et 7:1 pour le niveau AAA. Notre outil calcule automatiquement le contraste de votre couleur sur fond blanc et fond noir.
Tous les formats de couleur supportés
Entrez votre couleur dans n’importe quel format : code HEX avec ou sans #, valeurs RGB ou RGBA, teinte HSL ou HSLA, format HSV utilisé par Photoshop et Figma, quadrichromie CMJN pour l’impression, valeur décimale entière ou nom CSS standardisé. L’outil détecte automatiquement le format saisi et affiche instantanément les équivalences dans les neuf autres formats. Aucun bouton « Convertir » la conversion se met à jour à chaque frappe.
HEX, RGB, HSL : quel format utiliser selon votre contexte
Le format HEX (#RRGGBB) est le standard universel du web : supporté par tous les navigateurs, tous les outils de design et la totalité des CMS. C’est le format par défaut dans les CSS, les éditeurs de thèmes et les palettes de marque. Le format RGB convient aux manipulations dynamiques en JavaScript transparence variable, interpolation de couleurs, calculs d’animation. RGBA ajoute le canal alpha pour la gestion de l’opacité directement dans la valeur de couleur. Le format HSL (teinte, saturation, luminosité) est le plus intuitif pour les designers : ajuster la luminosité (L) sans toucher à la teinte (H) permet de créer des variantes claires et sombres d’une même couleur en une modification. C’est le format idéal pour construire un système de couleurs cohérent.
HSV et CMJN : les formats des outils créatifs et de l’impression
Le format HSV (teinte, saturation, valeur) est celui qu’affichent nativement Photoshop, Illustrator et Figma dans leurs sélecteurs de couleur. Si vous relevez une couleur dans l’un de ces outils et devez l’intégrer dans un CSS ou un thème web, cet outil fait la conversion en une saisie. Le format CMJN (cyan, magenta, jaune, noir) est le standard de l’impression quadrichromique. Il ne correspond pas exactement aux valeurs web les espaces couleur RVB et CMJN ne se superposent pas parfaitement mais la conversion donne une base de travail fiable pour coordonner les supports print et digitaux d’une même charte graphique.
Le ratio de contraste affiché : pourquoi c’est utile
Pour chaque couleur analysée, l’outil calcule le ratio de contraste avec le blanc et avec le noir selon la formule de luminance relative WCAG 2.1. Ce ratio indique immédiatement si la couleur est lisible en texte sur fond blanc ou sur fond sombre, sans avoir à ouvrir un outil d’accessibilité séparé. Un ratio de 4.5:1 ou plus est requis pour le texte courant en conformité WCAG AA le seuil légal en France pour les services en ligne soumis au RGAA.
Questions fréquentes
Tout savoir sur les formats de couleur.
Les deux modèles utilisent la teinte (H) et la saturation (S) mais définissent le troisième axe différemment. HSL utilise la luminosité (Lightness) : une valeur de 50% correspond à la couleur pure, 0% est noir, 100% est blanc. HSV utilise la valeur (Value) : 100% correspond à la couleur pure ou blanche selon la saturation, 0% est toujours noir. HSV est plus proche de la perception humaine et c'est pourquoi Photoshop et Figma l'adoptent dans leurs sélecteurs. HSL est plus pratique en CSS pour construire des systèmes de couleurs.
Les espaces couleur RVB (additif, pour les écrans) et CMJN (soustractif, pour l'impression) ne couvrent pas le même gamut de couleurs. Certaines couleurs vives affichables sur écran ne sont pas reproductibles en quadrichromie standard, et inversement. La conversion mathématique donne une approximation correcte pour la coordination print/digital mais ne remplace pas un profil ICC calibré pour une presse spécifique.
Utilisez le format RGBA — par exemple rgba(255, 0, 0, 0.5) pour un rouge à 50% d'opacité — ou le format HEX à 8 caractères où les deux derniers caractères représentent le canal alpha en hexadécimal (#FF000080 pour 50% d'opacité). La valeur alpha va de 00 (transparent) à FF (opaque) en HEX, et de 0 à 1 en RGBA et HSLA.
Seules 148 couleurs CSS nommées existent dans la spécification W3C — de aliceblue à yellowgreen. La correspondance n'est affichée que si la valeur convertie correspond exactement à l'une de ces couleurs définies. La grande majorité des couleurs de charte graphique n'ont pas de nom CSS.
Non. Toutes les conversions sont calculées localement dans votre navigateur via des fonctions mathématiques JavaScript. Aucune couleur, aucun code, aucune donnée n'est transmis à nos serveurs. La page ne fait aucune requête réseau lors de l'utilisation de l'outil.
Les conversions sont effectuees directement dans votre navigateur via JavaScript. Aucune donnee n'est transmise ni conservee par Osmova. La conversion CMYK est une approximation mathematique et ne remplace pas un profil ICC calibre pour l'impression. Conditions d'utilisation