Diseño

Generador de CSS Box Shadow Gratis

Diseña sombras CSS visualmente con controles deslizantes para offset, desenfoque, expansión, color y opacidad. Sin registro.

100% gratis — no se necesita cuenta

-5050
-5050
0100
050
01
Vista Previa
CSS Generado
box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.15);

Funciones de Generador de CSS Box Shadow Gratis

Sombras pixel-perfect sin adivinar valores CSS

Copiar CSS

Copia con un clic la propiedad CSS box-shadow generada.

Múltiples Sombras

Apila múltiples capas de sombra para efectos complejos y realistas.

5 Preajustes

Puntos de partida sutil, medio, fuerte, flotante y resplandor interior.

Controles Intuitivos

Deslizadores para offset horizontal/vertical, desenfoque, expansión, color y opacidad.

Preguntas frecuentes

¿Qué significan los valores de sombra?

El offset horizontal mueve la sombra izquierda/derecha, el vertical arriba/abajo, el desenfoque controla la suavidad, la expansión controla el tamaño y el color establece el color de la sombra.

¿Qué es una sombra interior (inset)?

Una sombra interior aparece dentro del elemento en lugar de fuera, creando un efecto presionado o empotrado.

¿Cuántas capas de sombra puedo usar?

CSS soporta capas de sombra ilimitadas. Esta herramienta te permite agregar múltiples. Los diseños comunes usan 1-3 capas para profundidad sutil y realista.

¿Te gustan nuestras herramientas gratuitas?

Crea Contenido Visual Impresionante

Usa sombras hermosas en tus gráficos de redes sociales.