Text Replacement

Uma palavra da frase é trocada pela próxima de uma lista com um deslize, um giro ou um fade.

Adicione um efeito "Word Rotate" (também chamado de rotating words ou flip words) em [onde].
Uma palavra da linha deve deslizar para cima e sair enquanto a próxima palavra de uma lista entra por baixo, pausando em cada palavra antes da próxima troca.
Evite que o resto da linha salte quando as palavras tiverem larguras diferentes, não faça os leitores de tela anunciarem cada troca e pare a rotação se o usuário preferir movimento reduzido (prefers-reduced-motion).

Uma palavra se desfoca e se funde na próxima no mesmo lugar.

Adicione um efeito "Morphing Text" (também chamado text morph) em [onde].
Uma palavra deve se desfocar e derreter na próxima no mesmo lugar, com uma fusão suave e pegajosa, e ficar parada por um instante antes da próxima troca.
Alterne as palavras sem cortes, deixe os leitores de tela lerem as palavras como texto normal e pare a alternância se o usuário preferir movimento reduzido (prefers-reduced-motion).

O texto é substituído por caracteres aleatórios que se renovam e aos poucos se resolvem na palavra final.

Adicione um efeito de hover "Text Scramble" (também chamado de text decode ou encrypted text) em [onde].
Quando o ponteiro passar sobre o texto, cada letra deve piscar rapidamente entre caracteres aleatórios e parar na letra real, resolvendo uma após a outra da esquerda para a direita.
Evite que a largura do texto salte enquanto ele embaralha, mantenha os leitores de tela no texto real e mostre o mesmo efeito no foco do teclado.

O texto sobe de trás de uma linha de recorte, como se surgisse do nada.

Adicione uma entrada de texto "Mask Reveal" (também chamada line mask reveal ou text masking) em [onde].
Cada linha deve subir de trás de uma borda invisível, como se surgisse do nada, uma após a outra, rápida e suave, sem quique.
Reproduza só uma vez quando o texto entrar na tela ao rolar e mostre o texto direto, sem movimento, se o usuário preferir movimento reduzido (prefers-reduced-motion).

As palavras de um parágrafo passam de apagadas para opacidade total conforme o usuário rola.

Adicione um efeito "Text Reveal" (também chamado de scroll text reveal ou word-by-word reveal) em [onde].
O parágrafo deve começar apagado e, conforme o usuário rola, cada palavra deve clarear até a intensidade total, uma após a outra, vinculada à posição de rolagem.
Ao rolar de volta para cima, as palavras devem apagar de novo, e o parágrafo inteiro deve continuar disponível para leitores de tela, qualquer que seja o esmaecimento.

Mover o ponteiro sobre um card revela um texto oculto sob uma borda de máscara ou um holofote.

Adicione um efeito "Text Reveal Card" (também chamado de spotlight text reveal) em [onde].
Conforme o ponteiro se move pelo card, uma borda vertical deve segui-lo de perto e revelar um texto oculto de um dos lados, de forma suave e direta, sem atraso.
Em telas de toque, onde não há ponteiro para seguir, deixe que arrastar ou tocar revele o texto oculto, e torne esse texto disponível para leitores de tela.