Linha Dedilhada Plus

Sobre este efeito

Divisor de seção que se comporta como corda de violão: chegando o mouse perto da linha, ela pega; arrastando pra cima ou pra baixo, a curva estica acompanhando o gesto, com o ponto mais puxado embaixo do cursor. Tirou o mouse, ela vibra e assenta. A vibração é calculada por tempo, então é a mesma num monitor de 60 ou de 144 Hz. Pegar a corda de novo no meio da vibração continua de onde ela está, sem tranco. No celular, tocar a linha dedilha ali, sem travar a rolagem. Dá para dedilhar por código, com aviso quando assenta. Usa a cor do texto em volta. Força do puxão, alcance, ritmo e amortecimento da vibração ajustáveis. Sem biblioteca: uma curva SVG.

Ficha

Categoria

Divisores

Onde combina

utilitário, 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

4,3 KB de código comprimido. Sem biblioteca externa.

No celular

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

Na loja desde

13/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-linha-dedilhada.

Assuntos

• divisor
• separador
• linha
• hr
• corda
• vibracao
• elastico
• svg
• hover
• mouse
• toque