Palavras na Dobra Plus

Sobre este efeito

Uma lista de palavras numa fita que dobra em zigue-zague, em perspectiva isométrica: cada palavra num degrau, alternando a face de cima, clara, e a face de lado, na sombra, então a fita parece dobrada de verdade. Com o mouse em cima, as palavras rolam uma dobra pra cima, letra a letra, numa onda da esquerda pra direita, e degrau a degrau, em cascata: cada dobra passa a mostrar a palavra seguinte; tirou o mouse, voltam. No modo fluxo, as palavras correm pela fita sozinhas, uma dobra de cada vez, sem fim. Uma palavra pode ficar na cor de destaque, e ela anda pela fita junto com as outras. Cada palavra fica centrada no seu degrau, sem encostar na vizinha, com espaço pra acento e cedilha. No celular, um toque rola e outro volta. Parado, não gasta nada. O leitor de tela lê o texto inteiro. Com a preferência de menos movimento, a fita fica parada. Altura dos degraus, cores das faces, tempos da rolagem, cascata, onda e intervalo do fluxo ajustáveis. JavaScript e CSS puros, sem biblioteca.

Ficha

Categoria

Texto

Onde combina

topo (hero), recursos

Alcance

Área: vive dentro de um bloco da página.

Plano

Incluso no Plus (R$ 19,90/mês) e no Ultra (R$ 39,90/mês).

Peso

5,2 KB de código comprimido. Sem biblioteca externa.

No celular

Leve: usa 16% do processador de um celular intermediário enquanto anima.

Na loja desde

28/09/2026

Como colocar no seu site

1. Criando o site com IA (Claude Code, Codex e parecidas): baixe o kit, extraia na pasta do projeto e cole o pedido pronto que a loja entrega. Não precisa saber programar.
2. Usando um construtor (Elementor, Shopify, Webflow e outros): a loja mostra o passo a passo de cada um.
3. Programando: importe o efeito.css e o efeito.js e marque o elemento com a classe fx-palavras-na-dobra.

Assuntos

• texto
• tipografia
• palavras
• lista
• isométrico
• 3d
• fita
• dobra
• hover
• rolagem de letras
• cascata