Box Shadow Generator

Créez des ombres CSS élégantes avec un aperçu en temps réel. Réglez la position, le flou, l'étendue, la couleur et l'opacité, puis exportez en CSS, SCSS ou Sass.

Paramètres

Aperçu

Aperçu

Code


            
            
            

Guide d'utilisation

La propriété box-shadow ajoute une ou plusieurs ombres : box-shadow: x y blur spread color;. Le mot-clé inset place l'ombre à l'intérieur.

  • Blur : plus la valeur est haute, plus l'ombre est diffuse.
  • Spread : agrandit ou réduit l'ombre.
  • Astuce : superposez deux ombres pour un rendu premium.

FAQ

Comment créer une ombre douce ?

Utilisez un grand flou avec une faible opacité, par exemple box-shadow: 0 8px 24px rgba(15,23,42,0.08).

Peut-on cumuler plusieurs ombres ?

Oui, séparez chaque ombre par une virgule dans la même propriété box-shadow.