Generador de Sombras CSS
Crea hermosas sombras CSS con vista previa en vivo y múltiples capas
Crea hermosas sombras CSS con vista previa en vivo y múltiples capas
- Prepara la entrada
Elige las opciones adecuadas con los controles de abajo.
- Ejecuta la tarea
Ajusta los controles de abajo y revisa la vista previa.
- Usa el resultado
Comprueba el resultado y usa las opciones disponibles para copiar o descargar.
Sombras en píxeles con exportación CSS, SCSS, clase Tailwind y JavaScript. Las variables necesitan definiciones en la página destino. Tailwind usa valores arbitrarios; comprueba en tu proyecto.
Código Generado
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.15);
Controles de Sombra
px
px
px
px
Configuración de Vista Previa
200px
Vista Previa en Vivo
Preview
Preajustes de Sombra
Sombras Sutiles
Sombras Medias
Sombras Fuertes
Material Design
Neumórfico
Generador de Sombras CSS
Sombras en píxeles con exportación CSS, SCSS, clase Tailwind y JavaScript. Las variables necesitan definiciones en la página destino. Tailwind usa valores arbitrarios; comprueba en tu proyecto.
Características
- Sombras en píxeles con exportación CSS, SCSS, clase Tailwind y JavaScript. Las variables necesitan definiciones en la página destino. Tailwind usa valores arbitrarios; comprueba en tu proyecto.
- Capas de Sombra
- Vista Previa en Vivo
- Preajustes de Sombra
Cómo usar
- Ajusta las propiedades de sombra con controles deslizantes
- Elige el color de sombra con selector de color
- Alterna entre sombras externas e internas
- Agrega múltiples capas de sombra
- Selecciona de preajustes profesionales
- Previsualiza sombra en tiempo real
- Personaliza el tamaño de la vista previa
- Copia el código generado en tu formato preferido
- Gestiona múltiples capas
- Usa controles de capa