🇫🇷WebFileTools/Générateur de box-shadow

Générateur de box-shadow CSS

Composez des ombres CSS multi-couches : offset, flou, étalement, couleur, inset. Export Tailwind. 100% navigateur.

Couche 1
CSS
box-shadow: 0px 8px 24px 0px #00000040;
Tailwind
shadow-[0px_8px_24px_0px_#00000040]

Vous utilisez souvent cet outil ? Pro inclut des fichiers jusqu'à 500 Mo et un traitement prioritaire.

Qu'est-ce que Générateur de box-shadow ?

L'outil génère du CSS box-shadow avec plusieurs couches, chacune paramétrable indépendamment (offset, flou, étalement, couleur, inset).

Comment utiliser cet outil ?

Ajustez les sliders de chaque couche, ajoutez ou retirez des couches, choisissez la couleur de fond de l'aperçu, puis copiez le CSS ou la classe Tailwind.

Avantages

  • Couches multiples
  • Sliders interactifs
  • Mode inset
  • Export CSS + Tailwind
  • Aperçu en temps réel

Questions fréquentes

Puis-je superposer plusieurs ombres ?
Oui, ajoutez autant de couches que nécessaire avec leurs propres paramètres : intérieures et extérieures peuvent coexister.
Comment fonctionne le mode inset ?
Inset rend l'ombre intérieure : elle apparaît dans le bord interne de l'élément au lieu de projeter à l'extérieur.
Le code est-il compatible Tailwind ?
Oui, l'outil génère également la classe arbitraire shadow-[...] utilisable directement avec Tailwind.