Sustituye [dónde] por la parte de tu página y pega el prompt en tu agente de IA. Cada prompt incluye el nombre de la animación, así la próxima vez puedes pedirla solo por su nombre.
Añade un efecto de texto con degradado animado (Animated Gradient Text, también llamado aurora text o rainbow text sweep) en [dónde].
Las letras deben rellenarse con un degradado cuyos colores fluyan lenta y suavemente por el texto en un bucle infinito y sin cortes.
Mantén el texto legible sobre su fondo en todo momento y deja los colores quietos si el usuario prefiere movimiento reducido (prefers-reduced-motion).
También llamadoAnimated Shiny Text, Metallic Shimmer Text, Gradient Text Shimmer
Un brillo recorre las letras una y otra vez.
Se usa en
Insignias y etiquetas de anuncio
Añade un efecto "Shimmer Text" (también llamado animated shiny text o metallic shimmer text) en [dónde].
Una franja de luz debe recorrer las letras con suavidad de izquierda a derecha y repetirse tras una breve pausa.
Mantén el texto legible bajo el brillo y déjalo quieto si el usuario prefiere movimiento reducido (prefers-reduced-motion).
El texto muestra reflejos iridiscentes de lámina holográfica que se mueven con el puntero o con el tiempo.
Se usa en
Tarjetas premium
Añade un efecto hover "Holographic Text" (también llamado holographic foil text) en [dónde].
Mientras el puntero esté sobre el texto, una franja de colores como de lámina holográfica debe deslizarse lenta y suavemente de un lado a otro sobre las letras, y el texto debe volver a su aspecto normal cuando el puntero se vaya.
Mantén las letras legibles en todo momento del brillo y muestra el mismo efecto con el foco del teclado.
También llamadoGradient animation, Moving gradient, Background gradient animation
Los colores de un fondo degradado se desplazan, se mueven o giran lentamente.
Se usa en
Fondos de hero, botones
Añade un fondo con degradado animado (Animated Gradient, también llamado gradient animation o moving gradient) en [dónde].
Los colores del degradado deben desplazarse lentamente por la zona en una deriva suave y continua, sin saltos visibles cuando el bucle se reinicia.
Mantén legible el texto encima sobre todos los colores, y detén el movimiento si el usuario prefiere movimiento reducido (prefers-reduced-motion).
Unas letras grandes funcionan como una ventana que muestra un vídeo en reproducción dentro de ellas.
Se usa en
Títulos hero
Añade un efecto "Video Text" (también llamado text video mask) en [dónde].
Unas letras grandes y gruesas deben funcionar como una ventana a un vídeo en reproducción, de modo que la imagen en movimiento solo se vea dentro de la forma de las letras.
Mantén el vídeo silenciado y en bucle sin controles, ofrece las palabras como texto real para los lectores de pantalla y muestra un fotograma fijo si el usuario prefiere movimiento reducido (prefers-reduced-motion).
El texto tiembla con cortes desplazados y separaciones de color rojo y cian, como una señal averiada.
Se usa en
Titulares cyberpunk o de videojuegos
Añade un efecto hover "Glitch Text" (también llamado text glitch o RGB split glitch) en [dónde].
Mientras el puntero esté sobre el texto, debe temblar en ráfagas rápidas y secas: finas franjas horizontales saltan de lado y dos copias de color se separan como una señal averiada, y luego vuelve a su sitio cuando el puntero se va.
Deja el texto real una sola vez en el documento para que los lectores de pantalla no lean las copias, y muestra el mismo efecto con el foco del teclado.
El texto se escala, se mueve o gira como un elemento gráfico en movimiento en lugar de ser texto estático.
Se usa en
Secciones hero de marca
Añade tipografía cinética (Kinetic Typography, también llamada kinetic text) en [dónde].
Filas de texto grande y repetido deben deslizarse de lado en direcciones alternas a un ritmo lento y constante, convirtiendo las palabras en un gráfico en movimiento.
Haz que cada fila se repita sin saltos visibles, que los lectores de pantalla lean el texto una sola vez y detén el movimiento si el usuario prefiere movimiento reducido (prefers-reduced-motion).