Color y Diseño
Generador de Sombras de Caja
Generador gratuito de box-shadow CSS. Diseña sombras con deslizadores para desplazamiento, desenfoque, expansión, color y opacidad. Apila múltiples sombras. Copia el CSS al instante.
Runs in your browser
Box shadow generator
CSS
box-shadow: 0px 10px 30px -10px rgba(59, 130, 246, 0.40);css
Nota del editor
Understanding · Five numbers. A whole light source.
Este capítulo en profundidad está disponible solo en inglés por el momento. La herramienta de conversión de arriba funciona en tu idioma; el artículo explicativo extenso aún no se ha traducido.
Preguntas frecuentes
Quick answers.
›Can I layer multiple shadows?
Yes — add as many shadows as you want, each with its own offset, blur, spread and color.
›Does it support inset shadows?
Yes — toggle 'inset' to make a shadow appear inside the element instead of outside.
›Does it output Tailwind?
Yes — for common single-shadow patterns. Multi-shadow stacks need custom CSS.
›Is the generator free?
Yes — fully free, no signup.
La gente también busca
Herramientas relacionadas
More in this room.
- Editor Avanzado de Box ShadowApile múltiples sombras con vista previa en vivo.
- Generador de GradientesGradientes CSS lineales, radiales y cónicos.
- Generador de Border RadiusEditor de border-radius CSS por esquina.
- Editor de Cubic BezierDiseña curvas de easing CSS visualmente.
- Generador de Animaciones CSSCrea fotogramas clave visualmente, copia CSS listo para pegar.
- Generador de Filtros CSSPrevisualiza en vivo el desenfoque, brillo, rotación de tono y más.