Tutorial — escolha sua saída
O baixador de SVG de site, e qual rota tomar
Todo método aqui termina com o mesmo vetor sanitizado. Eles diferem só em onde ele cai e em quanto você tem que decidir no caminho — então escolha pelo destino.
Assista — 19 segundos
Três saídas de uma varredura
A varredura só acontece uma vez nesta gravação. As três saídas partem da mesma lista — e é por isso que alternar entre elas não custa nada.
O que a gravação mostra
- Uma varredura, então três saídas
- Veja as prévias até achar
- Um arquivo — Baixar o atual
- A página inteira — Baixar tudo em ZIP
- Ou nenhum arquivo — Copiar código
- Mesma varredura, mesma página, qualquer que seja a que você precise
Decida pelo destino
Quatro rotas, e quando cada uma é a certa
A pergunta não é qual método é melhor — é o que você vai fazer com o vetor depois de tê-lo.
- Baixar o atual — você quer um vetor específico como arquivo, e se importa com o nome dele. A rota padrão. Como →
- Baixar tudo em ZIP — você quer o conjunto, ou ainda não sabe qual precisa e prefere resolver isso em disco. Sem duplicatas e numerado. Como →
- Copiar código / Copiar imagem — o destino é um editor ou um documento, e um arquivo em disco seria só um passo que você apaga depois. Como →
- Botão direito → Salvar isto como SVG — você está olhando direto para o que quer e não precisa de prévia, nome nem escolha. A rota mais rápida. Como →
E uma decisão que atravessa as quatro: se o destino não aceitar SVG — e-mail, a maior parte dos softwares de apresentação, uploaders de CMS antigos — mude o segmento de formato para PNG antes de baixar. Como →
A parte compartilhada
Três das quatro rotas começam idênticas. Só o último passo difere, e é o único sobre o qual você precisa pensar.
- Deixe a página no estado que você quer capturar. Faça login, role, abra o menu — o que colocar na tela os vetores que você quer. A varredura lê o DOM como ele está.
- Abra o popup e escaneie. Um clique. O contador informa o que a página renderiza, sem duplicatas.
- Prévia e escolha. Ant. e Próx. percorrem o conjunto, isolado e longe da página cheia.
- Escolha sua saída. Baixar o atual para um arquivo, Baixar tudo em ZIP para o conjunto, ou Copiar código / Copiar imagem para a área de transferência. Mude o segmento de formato antes se precisar de PNG ou JPG.
O que toda rota tem em comum
Qualquer que seja a saída, as mesmas duas coisas acontecem com o markup no caminho, e é por isso que o resultado é usável. O namespace xmlns é adicionado se faltava, o que é o que faz um arquivo tirado de uma página abrir como documento independente. E tudo que é executável — elementos <script>, manipuladores on*, referências externas — é removido, então você não carrega o comportamento da página de outra pessoa para o seu código ou sua ferramenta de design.
A versão de cinco segundos
- Precisa de um ícone, agora? Clique com o botão direito.
- Precisa de um ícone, bem nomeado? Popup, então Baixar o atual.
- Precisa do conjunto todo? Popup, então Baixar tudo em ZIP.
- Colando em código? Copiar código.
- Colando num documento ou chat? Copiar imagem.
- O destino rejeita SVG? Mude para PNG antes.
- Um arquivo
- Baixar o atual — com o nome de arquivo que você escolher.
- O conjunto
- Baixar tudo em ZIP — sem duplicatas e numerado.
- Nenhum arquivo
- Copiar código para editores, Copiar imagem para documentos.
- O mais rápido
- Botão direito → Salvar isto como SVG. Sem popup nenhum.
Vale saber
Perguntas frequentes
Qual método dá a melhor qualidade?
São idênticos. Toda rota roda o mesmo sanitizador e o mesmo conserto de namespace — elas diferem só em onde o resultado cai e em quanto você escolhe no caminho.
Posso baixar só alguns dos SVGs em vez de todos?
Sim. Percorra até cada um e use Baixar o atual, nomeando conforme avança. Baixar tudo em ZIP é para quando você quer o conjunto inteiro.
O que é removido do markup?
Elementos script, atributos de manipulador on* e referências externas. As formas ficam intactas, e o namespace xmlns é adicionado para o arquivo abrir sozinho.
Preciso reescanear entre downloads?
Não. Uma varredura monta a lista e toda saída parte dela. Reescaneie só se você mudar a página — abrir um modal, trocar de aba, rolar uma grade preguiçosa até aparecer.
E se o site não aceitar o SVG que eu baixei?
Mude o segmento de formato para PNG e baixe de novo. Clientes de e-mail, softwares de apresentação e uploaders de CMS antigos rejeitam SVG com frequência.
Uma varredura, a saída que você precisar
Um arquivo, um ZIP, a área de transferência, ou um único clique com o botão direito.