Générateur de box-shadow CSS
Réglez décalage, flou, étendue et couleur avec un aperçu en direct.
Générateur de box-shadow CSS
Créez une ombre CSS (box-shadow) visuellement et copiez le code. Réglez le décalage horizontal et vertical, le flou, l’étendue, la couleur et l’option inset, et voyez le résultat en direct sur la boîte d’aperçu.
La syntaxe box-shadow
box-shadow: [inset] offset-x offset-y blur spread color; — par exemple box-shadow: 0 6px 12px 0 #146c43;. Les décalages positifs poussent l’ombre à droite et vers le bas ; le flou adoucit le bord ; l’étendue l’agrandit ou la réduit ; inset dessine l’ombre à l’intérieur de l’élément.
Questions fréquentes
À quoi sert l’étendue (spread) ? Une valeur positive rend l’ombre plus grande que l’élément ; négative, plus petite.
Qu’est-ce qu’une ombre inset ? Elle dessine l’ombre à l’intérieur de la boîte, utile pour des effets enfoncés.