DevTulz Online

Generador CSS Box Shadow

Fondo


¿Qué es el CSS Box Shadow?

La propiedad CSS box-shadow añade efectos de sombra alrededor del marco de un elemento. Las sombras pueden desplazarse, desenfocarse, extenderse, colorearse y establecerse como inset (sombra interior). Múltiples sombras separadas por comas pueden apilarse para efectos ricos. Este generador le permite construir sombras complejas de múltiples capas visualmente y copiar el CSS listo para pegar al portapapeles.

Cómo usar el Generador de Box Shadow

  1. Ajuste los controles deslizantes de Offset X/Y, Blur y Spread para posicionar y dar forma a la sombra.

  2. Haga clic en la muestra de color para elegir un color de sombra y use el control deslizante de Opacity para la transparencia.

  3. Active 'Inset' para crear un brillo interior o un efecto de presión.

  4. Haga clic en '+ Añadir capa' para apilar múltiples sombras.

  5. Copie el CSS generado y péguelo en su hoja de estilos.

Keywords: generador CSS box shadow, box-shadow CSS, herramienta de sombra CSS, CSS drop shadow, sombra interior, sombra multicapa, CSS shadow en línea