Como ele é
Lembra nanquim se espalhando em papel molhado, visto de perto. Sobre um fundo quase branco, uma poeira de grãos índigo e ciano, com alguns pontos escuros, corre em filamentos finos que se curvam, se juntam em correntes e se desfazem, enquanto cada grão surge e some aos poucos. Alguns pontos maiores e bem claros parecem fora de foco e dão profundidade. Ao passar o mouse, as partículas são puxadas para o ponteiro num redemoinho; segurar o clique inverte a força e as empurra para longe. Um selo discreto no canto mostra o motor em uso.
Você pode estar procurando isto se pediu algo assim
- fundo com milhões de pontinhos se mexendo como fumaça
- partículas fluindo tipo tinta no papel para o hero de uma startup de IA
- aquele efeito de partículas que seguem o mouse em redemoinho
- fundo claro com fios de partículas correndo, sem neon
- algo que mostre poder de processamento, para site de tecnologia
- efeito de areia ou poeira escorrendo em correntes atrás do título
- fundo vivo para a página institucional que chame atenção logo de cara
Também chamado de
- partículas na GPU
- GPU particles
- WebGPU particles
- compute shader
- curl noise
- partículas em fluxo
- particle flow field
Quando usar
- Hero de empresa de tecnologia, IA ou dados em fundo claro
- Lançamento de produto que quer mostrar sofisticação técnica
- Fundo vivo de página institucional premium
- Apresentação ou evento em que o primeiro impacto conta
Quando evitar
- Sites de tema escuro, porque as partículas escurecem o fundo como tinta e quase somem no preto
- Páginas que já rodam outro efeito pesado de WebGL ou WebGPU
- Público com muitos aparelhos antigos: sem WebGPU nem WebGL2, sobra só a cor de fundo
Como pedir para a sua IA
Crie no hero um fundo de partículas na GPU com WebGPU e fallback para WebGL2: centenas de milhares de grãos em curl noise nas cores da minha marca, atração ao cursor, qualidade adaptativa, pausa fora da tela e quadro estático para movimento reduzido.
Com o THM Componentes, você cola o prompt completo do catálogo, que já traz o código-fonte deste componente, e a IA reproduz este efeito exato em vez de improvisar.
Perguntas sobre Limalha
Limalha funciona em navegadores sem WebGPU?
Sim. Limalha tenta WebGPU primeiro e, sem suporte, cai automaticamente para WebGL2 com 65.536 partículas, com tamanho e opacidade compensados para manter o visual. Sem nenhum dos dois, fica só a cor de fundo e o selo indica Estático. O evento backend informa qual motor iniciou, e o prompt do THM Componentes pede um fallback estático no Nuxt.
Limalha deixa o site lento?
É um componente Pesado no THM Componentes. Limalha mede o tempo dos quadros e, se eles ficarem lentos, reduz o número de partículas ativas e a resolução em etapas, recuperando depois. Também pausa fora da tela e com a aba em segundo plano. Use um efeito desse tipo por página e compare LCP e INP antes e depois.
Limalha respeita quem prefere menos movimento?
Sim. Com a preferência de menos movimento ativa, Limalha simula alguns segundos em silêncio e mostra um quadro parado com os filamentos formados, sem animação e sem resposta ao cursor. Se cores, tamanho ou opacidade mudarem, o quadro é redesenhado.
