Generador de Sombra de Caja | Herramienta CSS Box Shadow
Generador visual de Box Shadow CSS con vista previa en tiempo real.
0px
0px
10px
0px
20%
CSS Code
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
Cómo Usar
- Ajuste los controles deslizantes para cambiar el desplazamiento horizontal y vertical, el radio de desenfoque y el radio de propagación.
- Active 'Interior' para crear una sombra interior.
- Cambie el color de la sombra y la opacidad utilizando los controles.
- Copie el código CSS generado para usarlo en su proyecto.
Sobre Box Shadow
Desplazamiento Horizontal (Offset X)
Especifica la distancia horizontal de la sombra. Los valores positivos mueven la sombra a la derecha, los negativos a la izquierda.
Desplazamiento Vertical (Offset Y)
Especifica la distancia vertical de la sombra. Los valores positivos mueven la sombra hacia abajo, los negativos hacia arriba.
Radio de Difuminado
Cuanto mayor sea el valor, más grande y clara se volverá la sombra. Si se establece en 0, la sombra será nítida.
Radio de Propagación
Los valores positivos aumentan el tamaño de la sombra, los negativos lo disminuyen.