Generador de box-shadow CSS

Preguntas Frecuentes

• ¿Puedo apilar varias sombras?

  Sí. Añade hasta 8 capas de sombra: se renderizan en orden (la primera capa queda encima). Así se construyen los efectos de profundidad y neumorfismo, usando una sombra oscura abajo a la derecha apilada con una sombra más clara arriba a la izquierda.

• ¿Cuál es la diferencia entre desenfoque (blur) y expansión (spread)?

  El desenfoque suaviza el borde de la sombra (mayor = más difuso). La expansión aumenta o reduce el tamaño de la sombra de forma uniforme antes de desenfocar (positivo = más grande, negativo = más pequeño que el elemento).

• ¿Para qué sirve inset?

  Inset renderiza la sombra dentro del elemento en vez de fuera: útil para brillos interiores, efectos de presionado y apariencia de botones hundidos.

• ¿Funciona en todos los navegadores?

  Sí. box-shadow es CSS3 y está admitido en todos los navegadores desde IE9 en adelante, incluidos los móviles.