Visualizador HTML - Pré-visualizar HTML no Navegador Online

Entrada

Saída

O que é um Visualizador HTML?

Um visualizador HTML permite colar ou escrever HTML e ver instantaneamente uma pré-visualização ao vivo de como será renderizado em um navegador. Isso é útil para testar rapidamente trechos HTML, modelos de e-mail ou qualquer HTML sem precisar de um ambiente de desenvolvimento completo.

Esta ferramenta funciona inteiramente no seu navegador. A pré-visualização é renderizada em um iframe sandboxed usando o atributo srcdoc. A aba Código fonte mostra o código HTML formatado.

Como usar esta ferramenta

Colar ou carregar HTML

Cole seu HTML no editor esquerdo ou clique em Carregar para carregar um arquivo. Clique em Exemplo para experimentar um exemplo.

Pré-visualização ou ver código fonte

O painel direito mostra uma Pré-visualização ao vivo do seu HTML. Mude para a aba Código fonte para ver o código HTML formatado.

Copiar ou baixar

Use <strong>Copiar</strong> ou <strong>Baixar</strong> para salvar o código fonte formatado. Para validar o HTML use o Validador HTML.

Exemplo de Visualizador HTML

Cole qualquer trecho HTML e veja-o renderizado instantaneamente. Aqui está um exemplo simples:

Entrada HTML

Entrada

Quando um Visualizador HTML é útil

Um visualizador HTML é útil quando você quer testar trechos HTML rapidamente, verificar modelos de e-mail, revisar HTML gerado automaticamente ou compartilhar uma pré-visualização visual de HTML com colegas.

Para validar a estrutura HTML e detectar erros, use o Validador HTML.

Perguntas frequentes

A pré-visualização é sandboxed?

Sim. A pré-visualização é executada dentro de um iframe sandboxed com o atributo sandbox="allow-scripts". Isso impede o acesso a cookies ou à página pai.

Meu HTML é enviado para um servidor?

Não. A pré-visualização é renderizada inteiramente no seu navegador usando o atributo srcdoc do iframe.

Ferramentas relacionadas

Ver o HTML Living Standard e a documentação MDN do iframe.