Cómo funciona el generador
Introduzca el desplazamiento horizontal, el desplazamiento vertical, el radio de desenfoque y el color en los campos de entrada. La herramienta muestra instantáneamente la regla CSS y una vista previa en vivo para que pueda ajustar los valores en tiempo real.
Entendiendo la sintaxis
La propiedad text-shadow sigue el patrón text-shadow: offset-x offset-y blur-radius color. Los desplazamientos se miden en píxeles u otras unidades de longitud CSS, el radio de desenfoque puede ser cero para un borde nítido y el color acepta cualquier formato de color CSS.
Consejos para sombras efectivas
- Use un radio de desenfoque pequeño para un aspecto nítido y desplazado.
- Superponga varias sombras separando cada conjunto con una coma, colocando la sombra más cercana primero.
- Combine el color de la sombra con el fondo para un efecto de profundidad sutil, o use un color de contraste para un efecto dramático.
Más generadores CSS
Combina las sombras de texto con un generador CSS de border-radius para tarjetas y botones con esquinas redondeadas.