Text Hover Effect

Al mover el puntero sobre una tarjeta se descubre un texto oculto bajo un borde de máscara o un foco de luz.

Añade un efecto "Text Reveal Card" (también llamado spotlight text reveal) en [dónde].
Al mover el puntero por la tarjeta, un borde vertical debe seguirlo de cerca y descubrir un texto oculto en uno de sus lados, suave y directo, sin retraso.
En pantallas táctiles, donde no hay puntero que seguir, deja que un arrastre o un toque revele el texto oculto, y haz que ese texto esté disponible para los lectores de pantalla.

Los contornos de las letras se dibujan como un trazo antes de que aparezca el relleno.

Añade un efecto "Stroke Text Draw" (también llamado draw in text o animated stroke text) en [dónde].
Los contornos de las letras deben dibujarse solos con suavidad y, una vez completos, el relleno debe aparecer con un fundido.
Reprodúcelo una sola vez al cargar, mantén la palabra accesible como texto real y muestra el texto ya relleno si el usuario prefiere movimiento reducido (prefers-reduced-motion).

Las letras se llenan de un líquido que sube y ondula.

Añade un efecto "Liquid Fill Text" (también llamado water fill text) en [dónde].
Las letras con contorno deben llenarse de un líquido cuya superficie ondulada avanza de lado mientras el nivel sube y baja despacio, en un bucle suave y continuo.
Mantén la palabra como texto real para los lectores de pantalla y deja el líquido en un nivel fijo si el usuario prefiere movimiento reducido (prefers-reduced-motion).

El texto sigue una trayectoria curva y avanza por ella a medida que el usuario hace scroll.

Añade un efecto "Text Path Scroll" (también llamado text path curve scroll animation) en [dónde].
El texto debe apoyarse en una línea curva y deslizarse por ella a medida que el usuario hace scroll, avanzando al bajar y retrocediendo al subir.
Vincula el movimiento directamente a la posición del scroll sin retraso y mantén el texto legible como texto normal para los lectores de pantalla.

Una palabra se duplica en muchas copias apiladas que se desplazan con el scroll.

Añade un efecto "Text Repetition" (también llamado repeated text scroll) en [dónde].
Una palabra debe copiarse en una pila de copias de contorno más tenues que se abren desde detrás de ella a medida que el usuario hace scroll, y se vuelven a juntar al subir.
Vincula la apertura directamente a la posición del scroll y oculta las copias extra a los lectores de pantalla para que la palabra se lea una sola vez.

El texto existente sale con una animación y se reemplaza por un contenido nuevo.

Añade un efecto "Text Replacement" (también llamado text swap) en [dónde].
Cuando cambie el texto, los caracteres antiguos deben deslizarse hacia arriba y salir mientras los nuevos entran desde abajo, carácter a carácter, en una onda rápida y suave.
Evita que la caja del texto cambie de tamaño de golpe durante el cambio y anuncia solo el texto nuevo a los lectores de pantalla.