Convertisseur de codes couleur
Saisissez une couleur et copiez ses valeurs HEX, RGB et HSL.
#624DE3CC
À propos de cet outil
L'outil de conversion de codes couleur affiche une même couleur en HEX, RGB et HSL en même temps et permet de passer d'un format à l'autre. Saisissez une couleur, choisissez une couleur prédéfinie ou utilisez la pipette pour la prélever à l'écran, et ajustez aussi la transparence. Idéal pour obtenir le format de code dont vous avez besoin en design web, UI, CSS et retouche d'images.
Comment utiliser
Choisir une couleur
Saisissez une valeur dans les champs HEX, RGB ou HSL, ou sélectionnez une couleur prédéfinie. Dans les environnements compatibles, vous pouvez aussi utiliser le bouton pipette pour prélever directement une couleur à l'écran.
Régler la transparence
Déplacez le curseur de transparence pour contrôler l'opacité de la couleur. Le réglage se reflète dans l'aperçu en haut et dans les codes couleur.
Vérifier et copier le résultat
Contrôlez la couleur dans l'aperçu, puis appuyez sur le bouton de copie à côté des champs HEX, RGB ou HSL pour copier la valeur souhaitée dans le presse-papiers.
Fonctionnalités
HEX, RGB et HSL réunis
Saisissez une couleur dans un format et retrouvez ses valeurs HEX, RGB et HSL en même temps.
Aperçu en temps réel et transparence
L'aperçu se met à jour instantanément lorsque vous modifiez les valeurs ou la transparence, et le curseur permet de créer des couleurs semi-transparentes.
Pipette et couleurs prédéfinies
Dans les navigateurs compatibles, utilisez la pipette pour prélever une couleur à l'écran, ou cliquez sur une couleur prédéfinie courante pour l'appliquer rapidement.
Copiez chaque format séparément
Copiez la valeur HEX, RGB ou HSL séparément pour l'utiliser directement dans CSS, les outils de design et vos documents.
Saisissez directement les valeurs
Si vous connaissez déjà le code couleur, saisissez-le dans les champs pour voir le résultat de la conversion.
Traitement dans le navigateur
Vos valeurs et résultats de conversion restent dans votre navigateur : rien n'est envoyé à un serveur.
Cas d'utilisation
Convertir des codes couleur CSS
Convertissez une couleur HEX issue d'une maquette en RGB ou HSL pour l'utiliser dans vos styles CSS.
Transférer des couleurs entre outils de design
Convertissez la même couleur dans le format de code attendu par chaque programme lorsque les formats diffèrent.
Créer des fonds semi-transparents
Ajustez la transparence pour produire des couleurs semi-transparentes destinées aux calques, fonds, boutons et bordures.
Prélever des couleurs à l'écran
Utilisez la pipette pour sélectionner une couleur affichée sur une page web, une image ou un écran d'application et visualisez-la en code.
Gérer les couleurs de marque
Conservez ensemble les valeurs HEX, RGB et HSL des couleurs de marque pour une utilisation cohérente sur le web, l'impression et les documents de design.
Questions fréquentes
En quoi HEX, RGB et HSL sont-ils différents ?
HEX représente une couleur en hexadécimal, par exemple #8AD0FF. RGB exprime l'intensité du rouge, du vert et du bleu sous forme de nombres, tandis que HSL décrit une couleur par sa teinte, sa saturation et sa luminosité.
Quel format dois-je utiliser ?
HEX est simple et très répandu sur le web et dans les documents de design. RGB est pratique pour ajuster directement les canaux de couleur, et HSL est utile pour modifier intuitivement la teinte ou la luminosité.
Comment la transparence se reflète-t-elle dans le code couleur ?
Une valeur HEX avec transparence s'affiche comme un code à 8 chiffres, la valeur alpha étant ajoutée après le code habituel à 6 chiffres. Par exemple, dans #8AD0FFCC, les deux derniers chiffres représentent la transparence.
Quelle est la différence entre un HEX à 6 et à 8 chiffres ?
Un HEX à 6 chiffres contient uniquement les valeurs rouge, vert et bleu. Un HEX à 8 chiffres ajoute une valeur alpha à la fin pour représenter la transparence.
Que signifient une transparence de 100 % et de 0 % ?
100 % correspond à une couleur totalement opaque et 0 % à une couleur totalement transparente. Les valeurs intermédiaires produisent des couleurs semi-transparentes qui laissent apparaître le fond.
Quelle est la plage des valeurs RGB ?
Les valeurs RGB vont de 0 à 255 pour le rouge, le vert et le bleu. Plus la valeur est élevée, plus la composante de couleur est forte.
Que signifient les valeurs HSL ?
H est la teinte, généralement une valeur entre 0 et 359 degrés. S est la saturation et L la luminosité, chacune exprimée en pourcentage.
La pipette fonctionne-t-elle dans tous les navigateurs ?
La prise en charge dépend du navigateur et de l'environnement. Dans les environnements non compatibles, utilisez plutôt les champs de couleur ou les couleurs prédéfinies.
Puis-je modifier une couleur après avoir choisi une prédéfinition ?
Oui. Après avoir sélectionné une couleur prédéfinie, ajustez les valeurs HEX, RGB ou HSL ou la transparence pour affiner la couleur.
Que copie le bouton de copie ?
Chaque bouton de copie copie la valeur de couleur actuelle dans le format correspondant. Vous pouvez copier uniquement la valeur HEX, RGB ou HSL dont vous avez besoin.
Ma couleur saisie est-elle envoyée à un serveur ?
Non. Tout le traitement s'effectue localement dans votre navigateur. Vos valeurs de couleur et résultats de conversion ne sont jamais transmis à un serveur.
Outils connexes
