Aller au contenu principal

Générateur d'ombre CSS

Concevez des ombres portées multicouches visuellement et copiez le CSS prêt à l'emploi.

Comment ça marche

  1. 1Choisissez un préréglage ou un calque.
  2. 2Réglez X/Y, flou, étalement, couleur, opacité et ombre intérieure dans l’aperçu.
  3. 3Ajoutez, dupliquez, supprimez ou réordonnez les calques, puis copiez la déclaration ou variable CSS.

À propos de cet outil

X décale horizontalement et Y verticalement. Le flou adoucit le bord ; l’étalement change la surface de base. Inset dessine à l’intérieur et plusieurs calques combinent profondeur et accents. Exemple : box-shadow: 0 10px 30px -8px rgba(15, 23, 42, .25);. Évitez le flou excessif, le faible contraste et trop de calques.

Questions Fréquentes