UTILS.
100% en el navegador

Generador de Box Shadow CSS

Diseña una box-shadow visualmente con vista previa en vivo y copia el CSS.

Acerca de esta herramienta

Crea visualmente una box-shadow CSS arrastrando controles deslizantes para el desplazamiento, el desenfoque, la expansión, el color y la opacidad, y luego copia la regla lista para usar. Todo se actualiza en vivo y se ejecuta por completo en tu navegador.

Preguntas frecuentes

¿Qué hace el valor de expansión?
La expansión agranda (valor positivo) o reduce (valor negativo) la sombra antes de aplicar cualquier desenfoque, haciéndola más grande o más ajustada que el elemento.
¿Qué es una sombra inset?
Inset dibuja la sombra dentro del elemento en lugar de fuera, lo cual resulta útil para botones presionados o brillos interiores.

Más herramientas