Generador de Sombra CSS
Generador de sombras CSS en línea gratuito. Crea sombras complejas y en capas con vista previa en tiempo real.
Diseñe sombras CSS box-shadow en capas con un editor visual. Ajuste desplazamiento, desenfoque, expansión y color para crear efectos de profundidad en tarjetas, modales y botones.
Generador de Sombra CSS
Generador de sombras CSS en línea gratuito. Crea sombras complejas y en capas con vista previa en tiempo real.
Acerca de esta herramienta
Diseñe sombras CSS box-shadow en capas con un editor visual. Ajuste desplazamiento, desenfoque, expansión y color para crear efectos de profundidad en tarjetas, modales y botones.
Configuración de sombra
Propiedades de la caja
Color de fondo
Color de caja
Configuración de sombra
Capa 1
Color de sombra
Desplazamiento horizontal (10px)
Desplazamiento vertical (10px)
Radio de desenfoque (5px)
Radio de propagación (0px)
La salida aparece aquí ...
Vista previa
Código CSS
Configuración de sombra
Propiedades de la caja
Color de fondo
Color de caja
Configuración de sombra
Capa 1
Color de sombra
Desplazamiento horizontal (10px)
Desplazamiento vertical (10px)
Radio de desenfoque (5px)
Radio de propagación (0px)
Preguntas Frecuentes
Preguntas y respuestas frecuentes sobre este tema.
¿Qué propiedades puedo personalizar?
Puede personalizar el desplazamiento horizontal y vertical, el radio de desenfoque, el radio de expansión, el color de la sombra y activar sombras interiores.
¿Puedo agregar múltiples sombras?
Sí, agregue múltiples capas de sombra para efectos de profundidad complejos. Cada capa puede tener sus propias configuraciones de desplazamiento, desenfoque, expansión y color.
¿Genera código compatible con todos los navegadores?
Sí, la propiedad CSS box-shadow estándar funciona en todos los navegadores modernos sin prefijos de proveedor.
¿Mis datos se envían a algún servidor?
No, la generación de CSS box-shadow se ejecuta completamente en su navegador. Sus configuraciones de sombra se procesan localmente con JavaScript y nunca salen de su dispositivo.