Pular para o conteúdo
NewKitApp

Search tools

Jump to any tool by name

HTML Viewer

Cole o HTML e veja uma pré-visualização ao vivo e em sandbox de como ele é renderizado.

Preview

Scripts are disabled in the preview for safety — only markup and styling are rendered.

What is HTML Viewer?

Um visualizador de HTML renderiza a marcação colada exatamente como um navegador faria, sem precisar salvá-la como arquivo e abri-la, ou iniciar um servidor local. Cole um documento completo ou apenas um fragmento, e você obtém uma pré-visualização instantânea e atualizada ao vivo ao lado da sua fonte — útil para verificar como um modelo de e-mail, um snippet de widget que alguém lhe passou, ou um pedaço de marcação que você está depurando realmente parece antes de comprometer-se a usá-lo. A pré-visualização é executada dentro de um iframe em sandbox com script desabilitado, então o HTML colado pode renderizar sua estrutura e estilização com segurança sem nunca poder executar JavaScript contra essa página.

How to Use HTML Viewer

  1. Cole seu HTML na caixa de origem — um documento completo ou apenas um fragmento ambos funcionam.
  2. A pré-visualização renderizada é atualizada ao vivo no outro lado à medida que você digita.
  3. Se o seu fragmento não incluir sua própria embalagem <html>, uma é adicionada automaticamente nos bastidores para que ele ainda seja pré-visualizado corretamente.
  4. Os scripts nunca são executados na pré-visualização, por design — veja a FAQ para saber por quê.

Examples

Fragmento nu

Input: <p>Hello <strong>world</strong></p>

Output: Renderiza como um parágrafo com "world" em negrito, envolto em um documento mínimo automaticamente.

Documento completo

Input: <html><head><style>p{color:blue}</style></head><body><p>Texto estilizado</p></body></html>

Output: Renderiza com a cor de texto azul aplicada, exatamente como um navegador faria.

Common Mistakes

  • Colar um trecho que depende de um <script> para renderizar seu conteúdo (por exemplo, um widget de modelagem de cliente) e esperar ver a saída final — desde que os scripts não são executados, apenas a marcação estática que você digitou será exibida.
  • Usar caminhos de imagem/recursos relativos (como "images/logo.png") e esperar que sejam resolvidos — a prévia não tem uma URL de página real para resolver caminhos relativos, então use URLs absolutas ao visualizar.
  • Supor que uma prévia em branco significa HTML quebrado — um resultado vazio é mais frequentemente uma tag de fechamento ausente escondendo o restante do seu conteúdo do que um erro difícil, pois a prévia é tolerante como um navegador real é.
  • Esperar que envios de formulário ou comportamento interativo dirigido por JS funcionem na prévia — as restrições da sandbox bloqueiam especificamente isso.

Why Use This Tool

  • Prévia instantânea e ao vivo sem salvar arquivos ou servidor local necessário.
  • Seguro por construção — o iframe em sandbox não pode executar scripts contra essa página, independentemente do que você cola.
  • Funciona com fragmentos nus e documentos HTML completos.
  • Executa inteiramente no lado do cliente — nada do que você cola é enviado para um servidor.

Frequently Asked Questions