Converter SVG para WebP
Transforme um arquivo vetorial em WebP exatamente na largura em pixels que o seu layout precisa. Útil quando um CMS recusa o envio de SVG, quando uma prévia para redes sociais exige um bitmap ou quando uma ilustração tem tantos caminhos que o navegador demora para desenhá-la.
Conversor de imagens
ou solte arquivos JPG, JPEG, JPE … aqui ·
Até 95 MB por arquivo· Até 20 arquivos· Apagados após 30 minutos
Os arquivos são processados em nossos servidores e apagados após 30 minutos.
85 mantém as fotos visualmente idênticas ao original. Diminua só quando precisar de um arquivo menor.
JPG, BMP e EPS não têm transparência. Os pixels transparentes são preenchidos com esta cor.
Cor hexadecimal usada atrás dos pixels transparentes, por exemplo #FFFFFF.
Este formato guarda uma única imagem. Escolha saída GIF ou WebP se quiser manter a animação.
Um ícone multitamanho contém várias resoluções em um só arquivo; navegadores e sistemas operacionais escolhem a que precisam.
Mantenha as dimensões originais ou informe um dos lados, e a proporção é preservada.
Pixels do lado escolhido acima.
Porcentagem das dimensões originais.
sRGB é o certo para telas e web. Mantenha o original em fluxos de impressão; escala de cinza descarta as cores.
Só nos metadados; 0 mantém o valor original. Impressoras e alguns portais leem esse número; ele não altera as dimensões em pixels.
Como usar esta ferramenta
- 1
Envie o SVG
Adicione até 20 arquivos .svg exportados do Figma, Illustrator, Inkscape ou de uma biblioteca de gráficos, de até 95 MB cada.
- 2
Defina a largura de saída
Redimensionar imagem de saída começa com largura de 1200 px; mude para o dobro da largura que a imagem ocupará na página. Qualidade vem em 90, ou marque Sem perdas em Configurações avançadas para logos e ícones chapados.
- 3
Converta para WebP
Clique em Converter para WebP e baixe os arquivos ou um único ZIP. As áreas transparentes continuam transparentes.
Como converter SVG para WebP em um tamanho específico?
Envie o SVG, defina Redimensionar imagem de saída com a largura em pixels que você precisa (1200 px por padrão) e clique em Converter para WebP. O vetor é desenhado do zero nessa largura, então nada é ampliado nem fica borrado.
Quando um SVG deve virar WebP
O SVG virou Recomendação do W3C em 2001 e é o formato certo para a maioria dos logos e ícones: alguns quilobytes de texto que continuam nítidos em qualquer zoom. O problema começa quando o arquivo sai do seu próprio código. O WordPress e muitos construtores de lojas hospedados recusam envios de SVG, as prévias de links no Facebook, LinkedIn e X são buscadas como bitmaps, e as ferramentas de design exportam ilustrações com efeitos raster embutidos que transformam um arquivo vetorial em vários megabytes de marcação.
O WebP, lançado pelo Google em 2010 e aceito pelo Safari só na versão 14, em 2020, é o bitmap feito para isso: menor que o PNG com a mesma aparência, e com canal alfa de verdade. Gerar o SVG direto em WebP no tamanho final evita o desvio habitual por uma exportação grande em PNG. Se você também quer o caminho inverso, nossa página de WebP para SVG explica por que essa direção exige vetorização e não conversão.
Tamanhos de SVG para WebP nos espaços mais comuns da web
1200 × 630 px
Prévia de link Open Graph
Imagem exibida quando a página é compartilhada
1920 × 1080 px
Ilustração hero em largura total
Cobre a maioria das telas de desktop em 1×
1600 × 900 px
Imagem de coluna de blog em 2×
Para uma coluna de conteúdo de 800 px
400 × 100 px
Logo do cabeçalho em 2×
Para um espaço de logo de 200 × 50 px
SVG
Scalable Vector Graphics (SVG)
SVG é um formato vetorial baseado em XML, padronizado pelo W3C em 2001. Em vez de pixels, ele descreve formas, caminhos e texto, por isso fica nítido em qualquer tamanho e costuma ser minúsculo para logotipos e ícones. Ele aceita transparência, estilo com CSS, scripts e animação, e todos os navegadores o renderizam nativamente. O SVG não é adequado para fotografias, e ilustrações complexas podem ficar lentas para renderizar. Illustrator, Inkscape, Figma e os navegadores conseguem abri-lo e editá-lo.
- Compressão
- –
- Transparência
- Sim
- Animação
- Sim
- Lançamento
- 2001 · W3C
WEBP
Imagem WebP
WebP é um formato de imagem lançado pelo Google em 2010 para fazer as páginas web carregarem mais rápido. Ele aceita compressão com perda e sem perda, transparência alfa e animação em um único formato. Arquivos WebP com perda costumam ser 25–35% menores que JPEGs de qualidade visual parecida, e o WebP sem perda geralmente fica menor que o PNG. Todos os navegadores atuais o suportam, mas alguns programas de desktop mais antigos, serviços de impressão e formulários de envio ainda o rejeitam. Windows, macOS e a maioria dos editores de imagem modernos abrem arquivos WebP.
- Compressão
- Com ou sem perdas
- Transparência
- Sim
- Animação
- Sim
- Lançamento
- 2010 · Google
As pessoas convertem SVG em WebP para ter um bitmap leve e de tamanho fixo em lugares que não aceitam arquivos vetoriais ou os desenham devagar, como um CMS, uma prévia em rede social ou uma landing page pesada; de WebP para SVG é um trabalho de vetorização, não uma troca de formato.
Como o SVG é rasterizado e o que conferir
O conversor lê a largura, a altura e o viewBox do próprio SVG e desenha cada caminho na largura que você definir; a altura segue a proporção. Como o desenho acontece no tamanho final, traços finos e textos pequenos recebem suavização uma única vez, na escala certa. Ampliar um PNG pequeno depois nunca fica tão limpo.
As fontes são a surpresa de sempre. Se o SVG cita uma fonte que não está incorporada nem convertida em contornos, é usada uma fonte substituta e o comprimento das linhas muda. Converta o texto em contornos na sua ferramenta de design antes de exportar. Imagens externas vinculadas por URL dentro do SVG não são buscadas, então incorpore-as ou achate a arte antes.
Converter SVG para WebP: o que fazer e o que evitar
| Faça | Não faça |
|---|---|
| Gere em 2× a largura CSS exibida | Converter ícones inline simples, que ficam menores em SVG |
| Use Sem perdas para logos chapados com poucas cores | Gerar em 4000 px para um espaço de 600 px |
| Guarde o SVG original para tamanhos futuros | Enviar WebP em newsletters por e-mail |
| Publique o WebP com atributos width e height para evitar mudança de layout | Esperar texto editável: o WebP é feito de pixels, não de texto selecionável |
Perguntas sobre converter SVG para WebP
Que largura em pixels usar ao converter SVG para WebP?
Pegue a largura em que a imagem aparece em pixels CSS e dobre, para que fique nítida em telas de alta densidade de celulares e notebooks. Uma ilustração exibida em uma coluna de 800 px deve ser gerada com 1600 px. Ir para 3× raramente compensa na web, porque o arquivo cresce e o ganho visível é pequeno.
WebP é melhor que SVG para um site?
Para logos, ícones e diagramas simples, não: um SVG limpo é minúsculo e nítido em qualquer tamanho, então mantenha-o. O WebP vence em ilustrações complexas com gradientes, filtros ou milhares de caminhos, e em qualquer lugar que aceite apenas bitmaps, como prévias de redes sociais ou um CMS sem suporte a SVG.
O WebP mantém o fundo transparente do meu SVG?
Sim. O WebP tem canal alfa completo tanto no modo com perdas quanto no sem perdas, então as áreas sem preenchimento no SVG continuam transparentes. As bordas das formas recebem suavização contra a transparência, o que fica correto sobre qualquer cor de fundo.
WebP com ou sem perda para arte vetorial?
Sem perdas serve para logos, ícones e gráficos chapados com poucas cores sólidas; eles comprimem muito bem e mantêm bordas perfeitamente limpas. Com perdas, em qualidade 85 a 90, serve para ilustrações com gradientes, sombras ou texturas, em que os arquivos sem perdas ficam pesados. Teste os dois em um arquivo e fique com o menor resultado que pareça limpo.
Por que não consigo enviar SVG para o WordPress?
O WordPress deixa o SVG fora dos tipos de envio permitidos porque um SVG pode conter scripts. Ele aceita WebP desde a versão 5.8, lançada em 2021, então a conversão gera um arquivo que a biblioteca de mídia aceita sem plugin de segurança. Sites que precisam de vetores de verdade ainda podem adicionar suporte a SVG com um plugin que sanitiza o arquivo.
Posso usar o WebP em uma newsletter por e-mail?
Evite. Vários clientes de e-mail, incluindo o Outlook para Windows, não exibem WebP, e o Gmail também não renderiza SVG. Para e-mail, gere a imagem com SVG para PNG.
