TL
Tool Lab
💰Faire un don
💰Faire un don

Générateur d'Ombre de Texte CSS

Concevez visuellement des effets CSS text-shadow multicouches. Ajustez le décalage, le flou, la couleur et l'opacité. Copiez le CSS instantanément.

Tool Lab
Texte d'Aperçu
Taille de Police — 48px
Couleur du Texte
Couleur d'Arrière-plan
Couches d'Ombre (1)
Décalage X
Décalage Y
Flou
Couleur
Opacité — 30%
CSS Généré
text-shadow: 2px 2px 6px rgba(0,0,0,0.30);

À propos de cet outil

Le Générateur d'Ombre de Texte CSS vous permet de composer visuellement des ombres de texte multicouches et d'obtenir instantanément la sortie CSS. Chaque couche dispose de contrôles indépendants pour le décalage X/Y, le rayon de flou, la couleur et l'opacité.

L'opacité est appliquée comme canal alpha RGBA, offrant une transparence lisse sans astuces spécifiques au navigateur. Le CSS généré fonctionne dans tous les navigateurs modernes.

Comment utiliser

  1. Sélectionnez un préréglage pour commencer, ou configurez les couches manuellement.
  2. Tapez le texte d'aperçu et ajustez la taille de police et les couleurs.
  3. Ajoutez d'autres couches avec + Ajouter une Couche pour des effets complexes.
  4. Cliquez sur Copier CSS pour copier la déclaration text-shadow directement dans votre feuille de style.

Cas d'utilisation

Les développeurs frontend créent des titres de section hero avec profondeur. Les designers prototypent les effets de texte en CSS. Les équipes marketing créent du texte CTA accrocheur avec des effets lumineux et néon.

Questions fréquentes

  • Combien de couches puis-je ajouter ?Il n'y a pas de limite. CSS prend en charge n'importe quel nombre de valeurs text-shadow séparées par des virgules. En pratique, 1 à 4 couches couvrent la plupart des effets.
  • text-shadow fonctionne-t-il dans tous les navigateurs ?Oui. text-shadow est entièrement pris en charge par tous les navigateurs modernes depuis 2012.
  • Qu'est-ce que le rayon de flou 0 ?Une ombre aux bords nets sans flou, utile pour les effets rétro ou de contour.