Convertisseur de Couleurs
Convertissez entre HEX, RGB et HSL avec aperçu en direct.
Convertisseur de couleurs HEX, RGB et HSL pour le design web
En design web et developpement frontend, les couleurs sont representees dans differents modeles selon le contexte. Le format HEX (#RRGGBB) est le plus utilise dans les feuilles de style CSS par sa concision. Le modele RGB (Red, Green, Blue) definit les couleurs par le melange additif de rouge, vert et bleu avec des valeurs de 0 a 255, et c'est le modele natif des ecrans numeriques. Le HSL (Hue, Saturation, Lightness) organise les couleurs de maniere plus intuitive pour les designers, permettant d'ajuster la teinte, la saturation et la luminosite de facon independante.
Notre convertisseur transforme n'importe quelle couleur entre ces trois formats en temps reel. C'est particulierement utile lorsque vous travaillez avec des outils de design comme Figma ou Adobe XD qui exportent les couleurs en HEX, mais que vous avez besoin de valeurs RGB pour les animations JavaScript, ou lorsque vous souhaitez creer des variations d'une couleur en ajustant uniquement la luminosite en HSL. L'apercu en direct vous permet de verifier exactement a quoi ressemble la couleur avant de la copier.
Vous pouvez saisir des valeurs manuellement dans n'importe lequel des trois formats ou utiliser le selecteur de couleurs natif du navigateur pour choisir visuellement. Chaque format comprend un bouton de copie qui place la valeur dans le presse-papiers, prete a etre utilisee dans votre code CSS, JavaScript ou tout autre outil de design.
Questions fréquentes
Quelle est la difference entre HEX et RGB ?
Les deux representent exactement les memes couleurs, seule la notation change. Le HEX utilise des nombres hexadecimaux (base 16) au format #RRGGBB, tandis que le RGB utilise des nombres decimaux de 0 a 255 pour chaque canal. Par exemple, le blanc est #FFFFFF en HEX et rgb(255, 255, 255) en RGB. Le HEX est plus compact pour le CSS, tandis que le RGB est plus facile a manipuler par programmation.
Quand utiliser le HSL ?
Le HSL est ideal lorsque vous devez creer des palettes de couleurs harmonieuses ou des variations d'un meme ton. En separant la teinte (H) de la saturation (S) et de la luminosite (L), vous pouvez creer des versions plus claires ou plus sombres d'une couleur en ajustant simplement la luminosite, ou des versions plus vibrantes ou plus ternes en modifiant la saturation, sans alterer la teinte de base.
Quel modele de couleur utilisent les navigateurs ?
Les navigateurs utilisent nativement le modele sRGB. Toutes les valeurs CSS en HEX, RGB et HSL sont interpretees dans l'espace colorimetrique sRGB. Cela signifie que les couleurs s'affichent de la meme maniere sur tous les appareils calibres en sRGB, ce qui represente la grande majorite des ecrans actuels.
Envie d'en savoir plus ? Lisez notre guide complet →