Pular para o conteúdo
viewsvg

Visualizador SVG

Veja arquivos SVG online: solte um arquivo ou cole o código para visualizar, dar zoom e editar na hora. Tudo acontece no seu navegador.

Código SVG

Solte arquivos SVG aqui

ou cole código SVG no editor.

Ver 28.000+ ícones

Seu SVG fica neste dispositivo. Nada é enviado.

Atalhos de teclado

Abrir arquivos
⌘/Ctrl O
Baixar SVG
⌘/Ctrl S
Colar SVG (fora do editor)
⌘/Ctrl V
Aumentar / diminuir zoom
+ −
Zoom com o mouse
⌘/Ctrl + rolagem
Ajustar à tela
F
Tamanho real
1
Alternar fundo
B
Modo contorno
O
Grade de pixels
G
Mover
Arraste ou role

Abrir de uma URL

O arquivo é baixado diretamente pelo seu navegador. Só funciona se o servidor permitir requisições de outra origem (CORS).

Como usar o Visualizador SVG

  1. 1

    Abra seu SVG

    Arraste e solte um ou mais arquivos .svg, cole código SVG ou escolha arquivos do seu dispositivo.

  2. 2

    Visualize e edite

    A prévia é atualizada enquanto você digita. Dê zoom, mova, troque o fundo ou ative o modo contorno para ver cada traçado.

  3. 3

    Exporte

    Otimize com SVGO e baixe em SVG, PNG, JPG, WebP ou ICO, ou copie código React, Vue ou data URI.

O que é um visualizador de SVG?

Um visualizador de SVG abre arquivos Scalable Vector Graphics (.svg) e os desenha na tela. Como o SVG é um formato de texto, um bom visualizador também mostra o código por trás da imagem, para você ver exatamente por que uma forma, uma cor ou um degradê aparece daquele jeito.

O viewsvg é um visualizador de SVG online e editor grátis. Ele mostra seu arquivo assim que você o solta, permite dar zoom de 2% a 6400%, mover a imagem e conferi-la sobre fundo transparente, branco, preto ou personalizado. O editor de código fica ao lado da prévia e a atualiza enquanto você digita, então ver e corrigir um SVG acontece no mesmo lugar.

Como abrir um arquivo SVG em qualquer dispositivo

A forma mais rápida de ver um SVG em qualquer dispositivo é abri-lo aqui: clique em Abrir ou arraste o arquivo para esta página. Funciona no Chrome, Edge, Safari e Firefox, no computador e no celular, sem instalar nada. Seu sistema operacional também pode mostrar SVGs, com algumas limitações:

Windows

Por padrão, o Windows não mostra prévias de SVG no Explorador de Arquivos nem no app Fotos. Clique com o botão direito no arquivo, escolha Abrir com e selecione o Microsoft Edge ou o Chrome, ou instale o Microsoft PowerToys para ter miniaturas e painel de visualização de SVG. Para ver o código ou editar a imagem, abra-o no viewsvg.

Mac

Selecione o arquivo no Finder e pressione a barra de espaço para vê-lo com a Visualização Rápida, ou abra-o no Safari. Nenhum dos dois mostra o código, o viewBox ou o tamanho do arquivo. Solte o arquivo aqui para conferir essas informações.

iPhone e iPad

O app Arquivos consegue mostrar muitos SVGs. Para dar zoom, conferir a transparência ou exportar para PNG, abra o viewsvg no Safari, toque em Abrir e escolha o arquivo em Arquivos ou no iCloud Drive.

Android

A maioria dos apps de galeria do Android não suporta SVG. Abra esta página no Chrome, toque em Abrir e escolha o arquivo no armazenamento ou no Google Drive.

Linux

O visualizador de imagens do GNOME, o Gwenview e a maioria dos gerenciadores de arquivos mostram SVGs. Use o viewsvg quando também precisar do código, da otimização ou da exportação para PNG.

O que é um arquivo SVG?

SVG (Scalable Vector Graphics, gráficos vetoriais escaláveis) é um formato de imagem baseado em XML, criado pelo W3C. Em vez de pixels, um arquivo SVG descreve formas: traçados, círculos, retângulos, texto e degradês, com coordenadas dentro de um viewBox. Por isso o SVG fica nítido em qualquer tamanho, de um favicon de 16 px a um outdoor, e por isso ícones simples costumam ser menores que o PNG equivalente.

Todos os navegadores suportam SVG, então ele é o formato padrão para logotipos, ícones, ilustrações, gráficos e elementos de interface na web. Como o arquivo é texto puro, você pode abri-lo em qualquer editor de código, mas só vê como ele fica quando é renderizado. Um visualizador de SVG mostra as duas coisas.

Por que usar o viewsvg em vez de uma aba do navegador ou um app de design?

Abrir um SVG em uma aba do navegador mostra a imagem e nada mais. Um app de design como Illustrator, Figma ou Inkscape consegue editá-lo, mas demora para abrir e muitas vezes reescreve o código. O viewsvg fica no meio do caminho:

RecursoAba do navegadorApp de designviewsvg
Abre na hora, sem instalarSimNãoSim
Zoom, movimentação e ajuste à telaLimitadoSimSim, até 6400%
Ver e editar o código ao vivoNãoNãoSim
Fundos transparente, escuro e personalizadoNãoSimSim
Modo contorno e grade de pixelsNãoSimSim
Otimizar com SVGONãoNãoSim
Exportar PNG, JPG, WebP, ICO e JSXNãoEm parteSim
Os arquivos ficam no seu dispositivoSimSimSim

Também é seguro para arquivos de origem duvidosa: scripts, manipuladores de eventos e links javascript: são removidos antes de qualquer exibição.

Tudo o que você precisa para trabalhar com SVG

O Visualizador SVG faz parte de um único espaço para ver, editar, otimizar e converter arquivos SVG, sem cadastro, sem anúncios e sem upload.

Prévia instantânea

Zoom de até 6400%, movimentação, ajuste à tela e fundo transparente, branco, preto ou de qualquer cor.

Editor de código ao vivo

Realce de sintaxe, marcação de erros por linha, formatar e minificar, busca e histórico completo de desfazer.

Contorno e grade de pixels

Veja cada traçado no modo contorno e confira o alinhamento dos pixels com a grade ao dar zoom.

Inspecionar

Tamanho do arquivo e com gzip, viewBox, árvore de elementos com destaque e troca de cores com um clique.

Otimizar com SVGO

Reduza arquivos com prévias de antes e depois e precisão ajustável. Otimize todos os arquivos abertos de uma vez.

PNG, JPG, WebP e ICO

Exporte em qualquer tamanho até 16384 px, com transparência, ou copie o PNG direto para a área de transferência.

React, Vue e Svelte

Componentes JSX/TSX, React Native, Vue e Svelte limpos, com suporte a currentColor e props.

Vários arquivos de uma vez

Abra muitos SVGs em abas e otimize em lote ou baixe tudo em um ZIP de SVGs ou PNGs.

Privado e offline

Sem upload, sem conta. Seu trabalho fica salvo no navegador e o app funciona offline depois da primeira visita.

Perguntas frequentes

Como vejo um arquivo SVG online?

Arraste o arquivo .svg para esta página ou clique em “Abrir” e escolha o arquivo. O SVG aparece na hora na prévia e o código aparece no editor para você alterar ao vivo.

Qual programa abre arquivos SVG?

Qualquer navegador moderno (Chrome, Edge, Safari, Firefox) abre arquivos SVG, assim como apps de design como Illustrator, Inkscape e Figma. Um visualizador de SVG online como o viewsvg funciona em qualquer dispositivo sem instalar nada e ainda mostra o código, o tamanho e o viewBox.

Como vejo o código de um arquivo SVG?

Abra o arquivo aqui e o código-fonte aparece no editor ao lado da prévia, com realce de sintaxe e números de linha. Use Formatar para indentar código minificado e facilitar a leitura.

Posso editar o código SVG e ver as mudanças ao vivo?

Sim. O editor tem realce de sintaxe, marcação de erros e desfazer. Cada mudança redesenha a prévia. Você também pode girar, espelhar, redimensionar e trocar cores sem mexer no código.

Por que meu SVG mostra um erro?

SVG é XML, então precisa estar bem formado: tags fechadas, atributos entre aspas e um elemento raiz <svg> com xmlns="http://www.w3.org/2000/svg". O viewsvg destaca a linha exata do problema e mantém na tela a última prévia válida enquanto você corrige.

Posso abrir vários arquivos SVG de uma vez?

Sim. Solte vários arquivos e cada um abre em uma aba. Você pode alternar entre eles, otimizar todos de uma vez ou baixá-los em um ZIP de SVGs ou PNGs.

Posso ver arquivos SVG no celular?

Sim. O viewsvg funciona no Safari e no Chrome para celular. Toque em Abrir para escolher um SVG dos seus arquivos, faça o gesto de pinça para dar zoom e arraste para mover.

O visualizador mostra SVGs animados?

Sim. Animações SMIL (<animate>, <animateTransform>) e animações CSS dentro do SVG são reproduzidas na prévia. Apenas os scripts são removidos.

É seguro abrir arquivos SVG de origem desconhecida?

O viewsvg remove scripts, manipuladores de eventos e links javascript: antes de exibir e renderiza o SVG em um shadow DOM isolado, para que os estilos dele não afetem a página.

Meus arquivos SVG são enviados para algum lugar?

Não. O viewsvg roda inteiramente no seu navegador. Os arquivos são lidos, exibidos, otimizados e convertidos no seu dispositivo, e nada é enviado a um servidor. Depois da primeira visita, ele funciona até offline.

O viewsvg é grátis?

Sim. Todos os recursos são gratuitos, sem cadastro, sem marca d’água e sem limite de arquivos.

Mais ferramentas SVG grátis