Box-shadow: Se utiliza para añadir sombra a los bordes que tenemos en nuestras etiquetas.

1. Primer valor: Indica la sombra en el eje de las coordenadas x, eje horizontal. Si su valor es positivo la sombra se desplaza hacia la derecha, al contrario, si es negativo la sombra se desplaza hacia la izquierda.

2. Segundo valor: Indica la sombra en el eje de las coordenadas y, eje vertical. Si su valor es positivo la sombra se desplaza hacia abajo, al contrario, si es negativo la sombra se desplaza hacia arriba.

3. Tercer valor (blur): Es opcional. Marca la medida de desenfoque de la sombra.

4. Radio propagación sombra: Es opcional. Los valores positivos aumentan el tamaño de la sombra, los valores negativos disminuyen el tamaño. El valor predeterminado es 0 (la sombra es del mismo tamaño que el desenfoque).

5. Color de la sombra: Indica el color de la sombra que hemoscreado. Se puede especificar el color de todas las maneras posibles : por el nombre del color, por su codigo (#fff), por su RGBa, por su HSLa.

Además podemos hacer que nuestra sombra se dirija hacía dentro del objeto. Para ello tendremos que añadir como primer argumento inset a la propiedad box-shadow.

Herramienta para ver como trabajan las características de box-shadow.