Générateur CSS Text Shadow
Générez rapidement une déclaration CSS text-shadow personnalisée avec décalages, flou et couleur.
Exécuter l’outil
Ce générateur CSS produit la déclaration text-shadow adaptée à vos éléments de texte. Vous définissez le décalage horizontal, le décalage vertical, le rayon de flou ainsi que la couleur de l'ombre portée. Chaque valeur numérique est automatiquement convertie en pixels avec l'unité px, et l'instruction se termine par un point-virgule valide pour vos feuilles de style. Lorsque certains champs restent vides, l'outil applique des valeurs par défaut pratiques : 1 px horizontalement, 1 px verticalement, 2 px pour le flou et une teinte semi-transparente #00000033. Il accepte également des valeurs nulles à zéro pixel pour créer des effets nets sans flou ou alignés sur le texte d'origine. Vous copiez ensuite directement la ligne obtenue pour l'intégrer dans une classe CSS, un composant d'interface ou un fichier de mise en page web.
Mode d’emploi
- Indiquez la valeur numérique pour le décalage horizontal de l'ombre.
- Renseignez le décalage vertical souhaité en pixels.
- Ajustez le rayon de flou numérique ou laissez la valeur par défaut.
- Saisissez le code couleur au format hexadécimal, RGB ou nommé.
- Copiez la règle CSS text-shadow générée dans votre feuille de style.
Exemples
- Pour un décalage horizontal de 2, un décalage vertical de 4, un flou de 6 et la couleur #333333, le résultat affiche : text-shadow: 2px 4px 6px #333333;.
- Si vous laissez les champs vides, les paramètres par défaut produisent la déclaration : text-shadow: 1px 1px 2px #00000033;.
FAQ
Quelles sont les valeurs appliquées par défaut ?
Si vous ne renseignez aucun champ, l'outil applique 1 px pour le décalage horizontal, 1 px pour le décalage vertical, 2 px pour le flou et la couleur semi-transparente #00000033.
Peut-on utiliser des valeurs à zéro pixel ?
Oui, les valeurs 0 sont acceptées pour les décalages et le flou afin de créer des ombres nettes ou parfaitement centrées sous le texte.
Quels formats de couleur sont acceptés ?
Le champ couleur accepte les notations textuelles courantes en CSS, notamment les codes hexadécimaux (#333333, #00000033), les fonctions rgb() ou rgba(), et les noms de couleurs standard.