Generador de Box Shadow CSS

Ajusta los desplazamientos horizontal y vertical, el desenfoque, la expansión, el color y la opacidad, y activa inset si quieres que la sombra se dibuje dentro del elemento. La vista previa en vivo se actualiza al instante con cada cambio, y el CSS generado aparece debajo para copiarlo con un clic.

No. Todo se ejecuta por completo en tu navegador con JavaScript puro, así que ni los ajustes, ni los colores, ni el CSS generado se envían nunca a un servidor. La herramienta funciona sin conexión una vez cargada, lo que mantiene tu trabajo totalmente privado.

El desenfoque suaviza los bordes de la sombra (valores mayores dan bordes más difusos), mientras que la expansión agranda o encoge la sombra antes de aplicar el desenfoque. Inset invierte la sombra para dibujarla dentro de la caja en lugar de fuera, algo útil para efectos de pulsado o hundido.