Fita Cruzada Free

Duas fitas inclinadas que se cruzam como fita de isolamento, cada uma com um texto correndo em sentido contrário.

Sobre este efeito

Duas fitas inclinadas que se cruzam, como fita de isolamento, cada uma com um texto correndo em sentido contrário. O texto é repetido até fechar o loop, e o movimento é só CSS. Pausa com o mouse em cima e, opcionalmente, acelera com a rolagem da página. Hero de estúdio, faixa de aviso, separador entre seções, rodapé de campanha. Ângulo, cores de cada fita, tamanho, altura, velocidade, vão e separador ajustáveis. Sem biblioteca.

Ficha

Categoria: Letreiro
Onde combina: topo (hero), transições
Alcance: Área: vive dentro de um bloco da página.
Plano: Grátis com a conta: 1 download a cada 24 horas.
Peso: 3,6 KB de código comprimido. Sem biblioteca externa.
No celular: Leve: usa 8% do processador de um celular intermediário enquanto anima.
Na loja desde: 05/09/2026

Como colocar no seu site

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.
Usando um construtor (Elementor, Shopify, Webflow e outros): a loja mostra o passo a passo de cada um.
Programando: importe o efeito.css e o efeito.js e marque o elemento com a classe fx-fita-cruzada.

Assuntos

marquee
letreiro
fita
diagonal
cruzada
loop
texto
hero
aviso
css-puro