Convertisseur de couleurs
Collez une couleur en hex, rgb() ou hsl() et obtenez les trois formats plus une rangée prête à l'emploi de teintes et nuances pour votre design system.
#0071e3rgb(0, 113, 227)hsl(210, 100%, 45%)Not a color we can read. Try #0071e3, rgb(0, 113, 227) or hsl(211, 100%, 45%).
The swatch row mixes the color with white (left) and black (right) at 20/40/60/80% — handy for hover states and dark-mode variants.
Cet outil s'exécute entièrement dans votre navigateur. Vos données ne quittent jamais votre appareil — elles ne sont envoyées à aucun serveur.
Mode d'emploi
- 1Collez une couleur dans l'un des trois formats — hex, rgb() ou hsl().
- 2Lisez les valeurs converties et copiez celle qu'il vous faut.
- 3Récupérez teintes et nuances dans la rangée d'échantillons en dessous.
Convertisseur de couleurs
Donnez-lui #0071e3, rgb(0, 113, 227) ou hsl(211, 100%, 45%) — l'analyseur détecte le format automatiquement et sort hex, RGB et HSL d'un coup, chacun avec une copie en un clic.
Sous les valeurs, une rangée de teintes et nuances mélange votre couleur avec le blanc et le noir par pas de 20/40/60/80 % : états hover, bordures et variantes mode sombre instantanés, sans ouvrir un outil de design.
Questions fréquentes
Comment le HSL est-il converti en RGB ?
Par la correspondance cylindrique–RGB standard : chromaticité c = (1 − |2L − 1|) × S, une valeur intermédiaire x déterminée par le secteur de teinte, puis chaque canal décalé de m = L − c/2. Ce sont les formules manuelles du cours : les résultats correspondent aux outils de design.
Pourquoi mon code couleur s'affiche-t-il invalide ?
Les formes acceptées sont #RGB / #RRGGBB, rgb(r, g, b) et hsl(h, s%, l%). Les canaux doivent être dans les plages (0–255 pour RGB, 0–360 pour la teinte, 0–100 % pour le reste) et chaque partie séparée par une virgule ou un espace.
À quoi servent les teintes et les nuances ?
Les teintes (mélangées au blanc) font les fonds hover, badges et cartes ; les nuances (mélangées au noir) font les états appuyés, bordures et surfaces du mode sombre. Dériver les deux d'une seule couleur de marque garde chaque état de l'interface visuellement cohérent.
Outils associés
Sélecteur de couleurs
Choisissez une couleur dans l'échantillon ou capturez-en une directement à l'écran avec l'API EyeDropper — hex, RGB et HSL copiés en un clic.
Tous les outils →
Générateur de codes QR
Transformez n'importe quel texte ou URL en code QR net avec taille, couleurs et niveau de correction d'erreur réglables — téléchargez en PNG ou SVG.
Tous les outils →
Calculatrice de ratio d'aspect
À partir d'un ratio comme 16:9 et d'une dimension, obtenez instantanément la largeur ou la hauteur manquante — plus des préréglages du 1:1 au 21:9 pour la vidéo et le design.
Tous les outils →
Générateur d'UUID
Générez des identifiants UUID v4 aléatoires en vrac d'un clic — 1 à 500 à la fois, avec l'aléa cryptographique de votre navigateur. Gratuit, instantané, hors ligne possible.
Tous les outils →
Intégrer cet outil
Ajoutez cet outil à votre site en une ligne — il s'exécute dans le navigateur du visiteur.
<iframe src="https://zoyku.com/fr/tools/color-converter?embed=1" width="100%" height="640" style="border:0;border-radius:16px" title="Zoyku — color-converter" loading="lazy"></iframe>