Générateur d'ombres portées

Gratuit

Concevez des ombres portées CSS multicouches fluides avec un aperçu en direct et copiez-les en CSS ou Tailwind.

Contrôles

Couches5Distance24Flou48Étalement0Angle de la lumière90Opacité0.18Accélération1.8

CouleurinsetFond sombre

Aperçu

5 couches

CSS

box-shadow:
  0px 1.32px 2.65px 0px rgba(15, 23, 42, 0.08),
  0px 4.61px 9.22px 0px rgba(15, 23, 42, 0.08),
  0px 9.57px 19.14px 0px rgba(15, 23, 42, 0.07),
  0px 16.06px 32.12px 0px rgba(15, 23, 42, 0.06),
  0px 24px 48px 0px rgba(15, 23, 42, 0.05);

Tailwind

shadow-[0px_1.32px_2.65px_0px_rgba(15,23,42,0.08),0px_4.61px_9.22px_0px_rgba(15,23,42,0.08),0px_9.57px_19.14px_0px_rgba(15,23,42,0.07),0px_16.06px_32.12px_0px_rgba(15,23,42,0.06),0px_24px_48px_0px_rgba(15,23,42,0.05)]

Traité localement dans votre navigateur — rien ne quitte votre appareil.