Generador CSS de Sombra de Caja

Genera y previsualiza visualmente las propiedades CSS de box-shadow.

Configuración de Sombra
Ajusta los deslizadores para personalizar el efecto de sombra

Sombra 1

Preajustes
Prueba estilos de sombra predefinidos
Vista Previa
Ver el efecto de sombra generado
Preview
CSS Generado
box-shadow: 0px 4px 6px 0px #00000040;
Referencia de Propiedades de Sombra de Caja

Descripciones de Propiedades

  • Desplazamiento X: Posición horizontal de la sombra (positivo: derecha, negativo: izquierda)
  • Desplazamiento Y: Posición vertical de la sombra (positivo: abajo, negativo: arriba)
  • Desenfoque: Radio de desenfoque de la sombra (0: nítido, valores mayores más desenfocados)
  • Extensión: Tamaño de la sombra (positivo: expandir, negativo: encoger)
  • Color: Color de la sombra (HEX, RGB, RGBA, etc.)
  • Interior: Si la sombra es una sombra interior
    Generador CSS de Sombra de Caja | toolsmoah