Convertisseur HSL en RGBA
Convertissez teinte, saturation et luminosité en valeur rgba() prête pour la transparence en CSS.
Saisie hsl
Résultat · RGBA
rgba(255, 61, 119, 1)
HEX
#FF3D77
RGB
rgb(255, 61, 119)
HSL
hsl(342, 100%, 62%)
HSV
hsv(342, 76%, 100%)
CMYK
cmyk(0%, 76%, 53%, 0%)
Mode d’emploi: HSL en RGBA
- 1
Saisissez une couleur
Tapez un code couleur ou choisissez une couleur avec le sélecteur : chaque champ accepte le format qu’il affiche.
- 2
Voyez la conversion
Le résultat se met à jour instantanément pendant la saisie, avec un aperçu en direct de la couleur.
- 3
Copiez le code
Copiez la valeur dont vous avez besoin en un clic et collez-la dans votre design, votre CSS ou vos paramètres d’impression.
À propos du HSL et du RGBA
Le HSL et le RGBA reflètent deux manières différentes de penser la couleur. Le HSL définit une couleur par sa teinte, sa saturation et sa luminosité, ce qui facilite la création d’un ensemble de nuances apparentées. Le RGBA la définit par des valeurs de canaux rouge, vert et bleu de 0 à 255, plus un canal alpha pour l’opacité — le format qu’attendent de nombreuses bibliothèques JavaScript, le code de dessin sur canvas, les outils de graphiques et les anciennes bases de code CSS.
Le convertisseur transforme vos valeurs HSL en rgba() avec un alpha de 1, c’est-à-dire entièrement opaque. Modifiez ce dernier nombre pour obtenir de la transparence : 0.8 pour un panneau légèrement translucide, 0.3 pour un voile sur une photo, 0 pour une couleur invisible. Astuce : en CSS moderne, vous pouvez aussi ajouter l’alpha directement au HSL, comme dans hsl(160 60% 45% / 0.3), mais rgba() reste le choix le plus sûr lorsqu’une bibliothèque ou un modèle d’e-mail ne prend pas en charge la nouvelle syntaxe.
Tout fonctionne localement dans votre navigateur : vos images ne sont jamais envoyées sur un serveur.