Generador de sombras de texto CSS en línea

Crea impresionantes efectos de texto degradado para tu sitio web

Controls

2
2
4
50

de sombra Múltiples sombras

preestablecidos

Preview

Sombra Demo

Acerca de Text Shadow Generator

Fácil de usar

Genere hermosas sombras de texto con nuestra interfaz intuitiva. ¡No se requieren conocimientos de CSS!

Funciona

perfectamente en todos los dispositivos, desde teléfonos móviles hasta computadoras de escritorio.

Obtén código CSS limpio y listo para producción que puedes usar en tus proyectos al instante.

Cómo usar el generador

1

de sombras de texto Ajusta los controles deslizantes

Modifica el desplazamiento horizontal, el desplazamiento vertical, el radio de desenfoque y la opacidad para crear la sombra perfecta.

2

Elija un color

Elija cualquier color para la sombra de texto utilizando el selector de color o la entrada de código hexadecimal.

3

Obtén una vista previa de tu diseño

Mira cómo se ve tu sombra de texto en tiempo real con nuestra vista previa interactiva.

4

Copia el CSS

Haz clic en el botón de copiar para obtener el código CSS generado y usarlo en tu proyecto.

Ejemplos

de texto Efecto

neón Efecto de resplandor de neón Efecto

text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #0073e6, 0 0 20px #0073e6, 0 0 25px #0073e6;

texto 3D

texto 3D

text-shadow: 1px 1px 0px #c4c4c4, 2px 2px 0px #c4c4c4, 3px 3px 0px #c4c4c4, 4px 4px 0px #c4c4c4;

Sombra sutil Sombra

sutil Sombra

text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25);

interior Sombra

sombra

text-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.5);

Related Tools