Generador de sombra de caja CSS Genera sombras de caja CSS con múltiples capas, opciones de inserción y vista previa en tiempo real.

La propiedad box-shadow de CSS acepta uno o más valores de sombra separados por comas. Cada valor de sombra consiste en: desplazamiento horizontal (x), desplazamiento vertical (y), radio de difuminado (opcional), radio de propagación (opcional), color (opcional) y la palabra clave inset (opcional). Los valores x positivos empujan la sombra hacia la derecha, los valores y positivos la empujan hacia abajo. El radio de difuminado crea un efecto de desenfoque gaussiano: los valores más grandes crean sombras más suaves. El radio de propagación expande o contrae la sombra; los valores negativos crean sombras más pequeñas que el elemento. Las múltiples sombras se representan en orden: la primera sombra enumerada aparece en la parte superior. Para mejorar el rendimiento, usa las sombras de caja con moderación en elementos animados con frecuencia, ya que pueden desencadenar repinturas costosas. Considera usar filter: drop-shadow() para formas no rectangulares. Los navegadores modernos admiten completamente box-shadow sin prefijos de proveedor.