chevron_right

Generador de Box Shadow

Crea sombras CSS de forma visual con vista previa en tiempo real.

Preajustes

Shadow {{idx + 1}}

H-Offset: 0px

V-Offset: 4px

Blur: 16px

Spread: 0px

Color

Inset

Outset

CSS generado

box-shadow: 0px 4px 16px 0px rgba(0,0,0,0.15);

Herramientas similares

Generador de text-shadow

Crea efectos CSS text-shadow con vista previa en vivo.

Generador CSS Grid

Crea diseños CSS Grid responsivos con vista previa en vivo y código listo para copiar.

Generador de Keyframes CSS

Crea keyframes CSS personalizados de forma visual con vista previa en vivo y código listo para copiar.

Generador de animaciones CSS

Crea animaciones CSS reutilizables con vista previa de movimiento y keyframes listos para copiar.

Creador de cuadrícula de imágenes

Organiza varias imágenes en un único diseño de cuadrícula.

Generador de Numeros Aleatorios

Genera numeros aleatorios entre rangos personalizados.

Generador de Espirales SVG

Genera espirales SVG de Arquímedes y logarítmicas con control total sobre vueltas, radio, grosor del trazo y rellenos con degradado — perfecto para formas decorativas, logotipos y fondos.

apps

Mas herramientas

Explora nuestra coleccion completa de herramientas gratuitas en linea.

Crea sombras por capas sin pelearte con una cadena larga de CSS

Las sombras de caja son fáciles de empezar, pero afinarlas a mano se vuelve pesado cuando intervienen desplazamiento, desenfoque, extensión, color y varias capas. Un generador visual hace que ese proceso sea mucho más rápido y claro.

Qué puedes ajustar en la herramienta

Aquí puedes construir tanto sombras sutiles como efectos más marcados ajustando:

desplazamiento horizontal y vertical
radio de desenfoque y de expansión
color y transparencia alfa
sombras internas o externas
varias capas apiladas

Cuándo resulta útil

Un generador de box shadow es especialmente práctico para:

crear elevación para tarjetas
diseñar sombras suaves para componentes modernos
probar sombras internas y efectos de brillo
generar CSS reutilizable para un sistema de diseño

Las sombras por capas conviene usarlas con medida

Combinar varias sombras puede dar profundidad muy lograda, pero también ensuciar el resultado con facilidad. Cuando encuentres un efecto que te guste, merece la pena verlo sobre fondos claros y oscuros para confirmar que sigue funcionando bien.