Convertisseur de couleurs (HEX / RGB / HSL)
Convertissez une couleur entre les formats HEX, RGB et HSL directement dans votre navigateur. Le format d'entrée est détecté automatiquement.
Comment ça marche
Les designers travaillent en général avec des codes HEX (par exemple ceux copiés depuis Figma ou un logiciel de design), tandis que le CSS moderne tire souvent parti du format HSL pour ajuster facilement la teinte (hue), la saturation ou la luminosité d'une couleur sans recalculer un code HEX à la main — utile pour générer des variantes plus claires ou plus foncées d'une même couleur de marque pour les états hover, disabled ou les thèmes sombres. Cet outil détecte automatiquement si vous avez collé un code HEX, RGB ou HSL et le convertit dans le format dont vous avez besoin.
Quelle est la différence entre HEX, RGB et HSL ?
HEX (#rrggbb) et RGB (rgb(r, g, b)) décrivent tous les deux une couleur par ses composantes rouge, vert et bleu — HEX en base 16, RGB en base 10 — et représentent exactement la même information sous deux notations différentes. HSL (hsl(h, s%, l%)) décrit la même couleur autrement : par sa teinte (un angle sur la roue chromatique), sa saturation et sa luminosité, ce qui rend beaucoup plus intuitif de « garder la même couleur mais l'éclaircir » ou de « garder la même luminosité mais changer la teinte ».
Pourquoi utiliser HSL plutôt que HEX en CSS ?
Parce qu'il est facile de dériver des variantes cohérentes d'une couleur en ne modifiant que la composante luminosité (par exemple hsl(217, 91%, 60%) pour la couleur de base et hsl(217, 91%, 40%) pour un état hover plus sombre), sans avoir à recalculer un nouveau code HEX à chaque fois ni à deviner à l'œil si la teinte reste identique.
Traitement 100% local : la conversion s'effectue directement dans votre navigateur via WebAssembly, sans aucun appel à un serveur externe.