Espiral de Partículas Ultra

Um cometa sai do centro em laços e deixa pontinhos que formam um anel em volta do botão; no hover do botão, as partículas se espalham e a espiral se forma de novo.

Ver na loja e baixar

Sobre este efeito

Abertura para uma seção com um botão no meio: um cometa sai do centro em laços cada vez maiores e vai deixando pontinhos que formam um anel em volta do botão; pronto o anel, a cena gira devagar; com o mouse ou o foco no botão, os pontinhos se espalham pra fora como num salto no espaço, a cena dá meia volta e a espiral se forma de novo. Fica redondo em qualquer formato de tela, desenha todos os pontinhos de uma vez por quadro, para fora da tela e é transparente sobre o fundo da seção. Monta o anel e espera o botão (ou repete sozinho, se preferir), e o botão é o seu. Cores, raio, quantidade, tamanho e repetição ajustáveis. Com a preferência de menos movimento, mostra o anel pronto. Sem biblioteca.

Ficha

Categoria: Fundo
Onde combina: topo (hero), chamada pra ação, fundo
Alcance: Área: vive dentro de um bloco da página.
Plano: Exclusivo de quem assina o Ultra (R$ 39,90/mês).
Peso: 6,2 KB de código comprimido. Sem biblioteca externa.
No celular: Leve: usa 18% do processador de um celular intermediário enquanto anima.
Na loja desde: 14/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-espiral-de-particulas.

Assuntos

background
canvas
particulas
espiral
anel
cometa
hero
cta
abertura
espaco
js