Generador de Sombra de Texto CSS
Sobre esta herramienta
Genera el código CSS de la propiedad text-shadow ajustando visualmente el desplazamiento horizontal y vertical, el desenfoque (blur) y el color de la sombra, con una vista previa en vivo de texto de ejemplo que se actualiza mientras mueves los controles — sin tener que adivinar valores ni probarlos uno por uno en el navegador. Incluye además algunos estilos predefinidos populares con un clic, como efecto de relieve (embossed), sombra suave tipo "neón" o contorno duro (útil para texto legible sobre fondos con imágenes). El CSS generado se puede copiar directamente para pegar en tu hoja de estilos. Es el equivalente para texto del ya existente "Generador de Sombras CSS" (box-shadow, para cajas y contenedores). Todo el proceso ocurre en tu navegador sin depender de ningún servicio externo.
Preguntas frecuentes
¿Qué parámetros se pueden ajustar?
Cuatro: cuánto se desplaza la sombra a la derecha y hacia abajo (en píxeles), lo difuminada que está (blur) y su color. El código aparece listo para copiar y se actualiza al mover cada control.
¿Qué estilos predefinidos trae?
Tres: relieve (una sombra clara y otra oscura), neón (sin desplazamiento y con mucho desenfoque en verde) y contorno (una sombra negra sin desenfoque).
¿Cómo hago un efecto neón?
Usa desplazamiento 0, un desenfoque alto (de 10 px o más) y un color vivo. Para un brillo más intenso, repite la sombra varias veces separadas por comas en tu CSS.
¿Puedo poner varias sombras a la vez?
La herramienta genera una sombra (salvo el preajuste de relieve, que usa dos), pero en CSS puedes añadir todas las que quieras separándolas con comas.
¿Funciona text-shadow en todos los navegadores?
Sí, lo admiten todos los navegadores actuales. No afecta al tamaño del texto ni al diseño de la página.
Herramientas relacionadas
Generador de Sombras Neumórficas CSS
Crea el efecto de diseño suave "neumorphism" con dos sombras CSS
LocalGenerador de Sombras CSS (box-shadow)
Crea sombras CSS personalizadas y copia el código box-shadow
LocalGenerador de Botones CSS
Diseña botones CSS personalizados y copia el código HTML/CSS
LocalGenerador de Border-Radius CSS (formas orgánicas)
Crea formas orgánicas y 'blobs' con border-radius CSS
LocalGenerador de Tarjetas CSS (Cards)
Diseña tarjetas CSS personalizadas y copia el código HTML/CSS
LocalGenerador de Spinners CSS (indicadores de carga)
Crea indicadores de carga (spinners) animados en CSS puro