Générez des box-shadows CSS avec prévisualisation en direct. Ajoutez plusieurs couches d'ombre pour la profondeur et le réalisme, puis copiez le CSS.
Faites glisser les curseurs pour ajuster le décalage horizontal, le décalage vertical, le rayon de flou, l'extension, la couleur et l'opacité d'une box-shadow CSS. Cochez Inset pour un effet d'ombre intérieure. La prévisualisation se met à jour en direct et le CSS généré est prêt à copier directement dans votre feuille de style.
Utilisez les curseurs pour ajuster chaque paramètre d'ombre. Cochez Inset pour en faire une ombre intérieure. Cliquez sur l'échantillon de couleur pour changer la couleur de l'ombre. Le CSS généré se met à jour en direct dans le bloc de code sombre — cliquez sur Copier pour l'obtenir.
L'extension agrandit (valeur positive) ou réduit (valeur négative) l'ombre avant l'application du flou. Une extension positive rend l'ombre plus grande que l'élément ; négative la rend plus petite.
CSS prend en charge plusieurs box-shadows sous forme de liste séparée par des virgules. Générez chaque ombre ici séparément et combinez-les manuellement : box-shadow: ombre1, ombre2;
Cet outil fonctionne entièrement dans votre navegador. Rien de ce que vous tapez ou collez n'est envoyé à un serveur — tout le traitement se fait localement sur votre appareil.