Inicio
Tom Utilities

Generador de sombras CSS

Utilidades para desarrolladores

Crea sombras con controles de desplazamiento, desenfoque, expansión y color, y copia el CSS.

Cómo usar

Build a shadow

Move the sliders to adjust the horizontal offset, vertical offset, blur and spread. Choose a color and enable inset for an inner shadow.

  1. Adjust the four sliders.
  2. Pick a shadow color.
  3. Copy the generated box-shadow declaration.

Negative values

Offsets and spread accept negative values, which move the shadow up or left and shrink it.

Preguntas frecuentes

What is spread?

Spread expands or contracts the shadow before it is blurred. Positive values make the shadow larger.

Why is my shadow translucent?

The generated color includes partial transparency so the shadow blends with the background. Replace the color value if you want it fully opaque.

Herramientas relacionadas

Generador de border-radius Previsualiza y copia valores de border-radius CSS para cada esquina en píxeles o porcentaje. Generador de degradados CSS Diseña degradados CSS lineales o radiales con vista previa en vivo y CSS listo para copiar. Formateador CSS Embellece CSS con una propiedad por línea y sangría uniforme. Generador de UUID/GUID Genera UUID aleatorios de versión 4 y cópialos uno a uno o en bloque. Generador de hash Calcula resúmenes MD5, SHA-1, SHA-256 y SHA-512 de cualquier texto. Conversor de marca de tiempo Convierte entre marcas de tiempo Unix, ISO 8601 y fechas locales legibles.