Generador de text-shadow CSS
Genera la propiedad CSS text-shadow con desplazamientos en píxeles, desenfoque y color personalizados.
Ejecutar herramienta
Este generador crea declaraciones CSS listas para incorporar a tus hojas de estilo y añadir sombras a textos en páginas web. Puedes definir el desplazamiento horizontal en el eje X, el desplazamiento vertical en el eje Y, el radio de desenfoque y el tono de color deseado. Cada valor numérico de distancia y desenfoque se formatea automáticamente con la unidad px, cerrando la instrucción con un punto y coma estándar. Si dejas campos vacíos, la utilidad aplica parámetros predeterminados: un desplazamiento horizontal de 1px, un desplazamiento vertical de 1px, un desenfoque de 2px y un color semitransparente (#00000033). También admite valores numéricos iguales a cero cuando necesitas una sombra nítida sin difusión o alineada exactamente con el texto original. El campo de color admite texto libre, lo que facilita introducir códigos hexadecimales estándar con o sin canal alfa según el contraste tipográfico que busques.
Instrucciones
- Introduce los desplazamientos horizontal y vertical en píxeles dentro de sus casillas.
- Establece el valor numérico para el radio de desenfoque.
- Escribe el valor o código de color que deseas aplicar a la sombra.
- Pulsa en ejecutar para obtener la regla CSS formateada con sus unidades correspondientes.
Ejemplos
- Con un desplazamiento X de 2, un desplazamiento Y de 4, desenfoque de 6 y color #1e293b, el resultado muestra: text-shadow: 2px 4px 6px #1e293b;
- Al omitir todos los campos y conservar los valores por defecto, la herramienta genera: text-shadow: 1px 1px 2px #00000033;
Preguntas frecuentes
¿Qué ocurre si no introduces ningún valor en los campos?
La herramienta aplica los valores por defecto: 1px en X, 1px en Y, 2px de desenfoque y #00000033 como color.
¿Se pueden utilizar valores de cero en el desenfoque y los desplazamientos?
Sí, puedes asignar 0 a los desplazamientos o al desenfoque para conseguir una sombra sin dispersión o sin desfase espacial.
¿Qué formato de color admite el generador?
El campo acepta entradas de texto, por lo que puedes especificar códigos hexadecimales como #00000033 o valores estándar compatibles con CSS.