Design

Convertisseur Couleurs HEX / RGB / HSL

Convertissez vos couleurs en temps réel entre HEX, RGB et HSL. Harmonies incluses.

#FF5733
R (0–255)
G (0–255)
B (0–255)

rgb(255, 87, 51)

H (0–360°)
S (0–100%)
L (0–100%)

hsl(11, 100%, 60%)

Harmonies de couleurs

Complémentaire (±180°)

Analogues (±30°)

Triadique (±120°)

Cliquez sur une couleur pour copier son code HEX.

Questions fréquentes

Comment convertir une couleur HEX en RGB ?

Une couleur HEX est composée de 6 caractères hexadécimaux représentant les canaux Rouge, Vert et Bleu. Par exemple, #FF5733 se décompose en R=255 (FF), G=87 (57), B=51 (33).

Chaque paire de caractères hexadécimaux se convertit en décimal pour obtenir la valeur du canal (0-255).

Quelle est la différence entre RGB et HSL ?

RGB (Rouge, Vert, Bleu) est un modèle additif qui décrit la couleur par l'intensité de chaque canal lumineux (0-255). HSL (Teinte, Saturation, Luminosité) est plus intuitif : la teinte va de 0° à 360° (rouge=0°, vert=120°, bleu=240°), la saturation de 0% (gris) à 100% (couleur vive), et la luminosité de 0% (noir) à 100% (blanc).

Qu'est-ce qu'une couleur complémentaire ?

Une couleur complémentaire est la couleur opposée sur le cercle chromatique, soit une teinte décalée de 180°. Par exemple, le complémentaire du rouge (0°) est le cyan (180°).

Les paires complémentaires créent un contraste maximal et sont très utilisées en design pour attirer l'attention.

Comment utiliser les couleurs analogues en design ?

Les couleurs analogues sont des teintes adjacentes sur le cercle chromatique, généralement à ±30° de la couleur principale. Elles créent une harmonie douce et cohérente, idéale pour des interfaces apaisantes.

Par exemple, un bleu (240°) sera harmonieux avec un bleu-violet (210°) et un bleu-vert (270°).

Qu'est-ce qu'une harmonie triadique ?

Une harmonie triadique utilise trois couleurs équidistantes sur le cercle chromatique, séparées de 120° chacune. C'est une palette très équilibrée et vibrante.

Par exemple, rouge (0°), vert (120°) et bleu (240°) forment une triade primaire. Cette approche offre beaucoup de contraste tout en restant harmonieuse.

Explorez nos autres outils Design :

Générateur Palette de Couleurs Bientôt
Vérificateur Contraste WCAG
Outil Combinaison de Polices Bientôt
Calculateur Ratio d'Image
Générateur Box Shadow CSS
Générateur Border Radius CSS

Conversions basées sur les formules standard CSS Color Level 4. HEX : notation hexadécimale 24 bits (8 bits par canal). HSL : Hue-Saturation-Lightness (W3C CSS Colors). Dernière mise à jour : mars 2026.