Générateur de box-shadow CSS
Créez des ombres CSS (box-shadow) avec aperçu en direct : décalage, flou, étendue, couleur, opacité, plusieurs couches et modèles prêts à l’emploi.
Mode d’emploiGénérateur d’ombre CSS
Disponible en: 
Générateur de box-shadow CSS: à quoi ça sert
Réglez le décalage, le flou, l’étendue, la couleur et l’opacité de l’ombre et voyez le résultat immédiatement. Combinez plusieurs couches pour des ombres réalistes et utilisez l’option interne (inset).
Des modèles prêts à l’emploi existent : douce en couches, Material, flottante, contour, neumorphisme et néon. Le code CSS est prêt à copier, avec le border-radius.
Mode d’emploi
- Choisissez un modèle ou partez de zéro.
- Réglez les couches et les couleurs.
- Copiez le CSS.
Quand l’utiliser
- Donner de la profondeur aux cartes et aux boutons.
- Créer des effets de neumorphisme et de néon.
- Apprendre comment fonctionne box-shadow.
Questions fréquentes
Comment obtenir une ombre douce et réaliste ?
Utilisez plusieurs couches de faible opacité : une courte et nette et une longue et floue. Le modèle « Douce en couches » le fait déjà.
Qu’est-ce que l’ombre interne (inset) ?
C’est l’ombre dessinée à l’intérieur de l’élément, qui donne l’impression qu’il est enfoncé. Cochez l’option « Interne » sur la couche.
Vraiment gratuit ?
Oui, 100 % gratuit. Sans inscription, sans abonnement et sans limite d’utilisation. Tous les outils de Tools123 sont gratuits.