Convertisseur de Couleurs Hex ↔ RGB ↔ HSL — Outil Gratuit
Convertissez entre les formats de couleur Hex, RGB et HSL en temps réel. Les trois se mettent à jour simultanément quand vous éditez l'un d'eux. Sélecteur de couleur intégré et export CSS.
HEX
RGB
HSL
Convertisseur de Couleurs Hex ↔ RGB ↔ HSL — Trois Formats, Un Outil
Convertissez n’importe quelle couleur entre Hex (#RRGGBB), RGB (rouge/vert/bleu 0–255) et HSL (teinte/saturation/luminosité) instantanément. Tapez ou collez un code hex, utilisez le sélecteur, ou ajustez les nombres RGB/HSL directement — les trois formats restent synchronisés. Tout s’exécute dans votre navigateur.
Les trois formats expliqués
- HEX (#RRGGBB) : le standard web. Six chiffres hexadécimaux encodant rouge, vert, bleu. Compact, mais peu lisible. Exemple :
#585BE8 - RGB : trois valeurs de 0 à 255 — combien de rouge, vert et bleu. Correspond directement à l’intensité des pixels. Exemple :
rgb(88, 91, 232) - HSL : teinte (0–360°, la position sur le cercle chromatique), saturation (0–100 %, à quel point c’est vif), luminosité (0–100 %, sombre à clair). Idéal pour concevoir des palettes — changez une valeur et les autres restent identiques. Exemple :
hsl(239, 76%, 63%)
Astuces
- Utilisez HSL pour les variations : besoin d’une teinte plus sombre ? Réduisez L. Une version plus douce ? Réduisez S. La teinte reste exacte
- Les raccourcis hex à 3 chiffres fonctionnent :
#F00=#FF0000= rouge - Sélecteur de couleur : cliquez sur l’échantillon pour ouvrir le sélecteur de votre OS pour une sélection visuelle
Usages courants
- Faire correspondre les couleurs d’une capture d’écran en CSS
- Construire un design system avec des variations cohérentes
- Traduire entre formats d’outils de design (Figma utilise HSL, Photoshop utilise HSB)
- Générer des contrastes de couleur accessibles
Confidentialité
Tout s’exécute dans votre navigateur. Aucune couleur n’est envoyée.
Étape par étape
- Saisissez une couleur dans l’un des trois formats : HEX, RGB ou HSL.
- Les deux autres formats se mettent à jour instantanément.
- Copiez le format voulu avec Copier HEX, Copier RGB ou Copier HSL.
Questions fréquentes
Quand préférer HSL à HEX ?
HSL est pratique pour créer des variantes d’une couleur : plus claire, plus sombre ou moins saturée. Il suffit de modifier la saturation ou la luminosité.
Quel lien entre HEX et RGB ?
HEX est la même information que RGB, en notation hexadécimale. Deux chiffres représentent chacun le rouge, le vert et le bleu.
Les valeurs sont-elles enregistrées ?
Non. Le calcul se fait dans votre navigateur.