Generador de Box Shadow - Crea sombras CSS visualmente
Ajusta box-shadow intuitivamente con controles deslizantes y selectores de color. Compatible con múltiples capas e inset.
Layer 1
4px
4px
10px
0px
#00000040
#f0f0f0
#ffffff
Vista previa
CSS
box-shadow: 4px 4px 10px 0px #00000040;
Cómo usar
- Ajusta X/Y/Blur/Spread/Color con controles deslizantes
- Agrega múltiples capas de sombra
- Copia el código CSS para usar
Preguntas frecuentes
- ¿Puedo agregar múltiples sombras?
- Sí. Puedes apilar múltiples valores de box-shadow.
- ¿El CSS generado se puede usar directamente?
- Sí. Copia el código y pégalo directamente en tu archivo CSS.
- ¿Se admite la sombra inset?
- Sí. La sombra interior (inset) se puede activar/desactivar.
- ¿Se envían mis datos a un servidor?
- Todo el procesamiento ocurre en el navegador. No se envían datos a un servidor.
- ¿Qué hago si la sombra no se ve como esperaba?
- Intenta ajustar los valores de desenfoque, extensión y opacidad del color. Comprueba también si la opción inset está activada correctamente.
Herramientas relacionadas
Historial de actualizaciones
Última actualización: 2026-02-21
- 2026-02-21 Lanzamiento inicial