Editor Markdown

Escreva Markdown com pré-visualização ao vivo e baixe como HTML

Editor

Pré-visualização

Como funciona

Editor Markdown — Escreva Markdown com pré-visualização ao vivo e baixe como HTML. Todo o processamento acontece no seu navegador — sem upload, sem cadastro, sem e-mail. Grátis para sempre.

Última atualização: 2026-05-06

Editor's note

Construímos isso porque queríamos rascunhar posts de blog e READMEs sem commitar cada conserto de vírgula pelo git só para ver como um título renderiza. Pré-visualizadores de Markdown locais existem, mas a dança de instalar-uma-extensão-do-VS-Code é mais pesada do que a escrita em si num post rápido. Uma aba de navegador que mostra a pré-visualização no segundo em que você digita combina com nosso hábito real de escrita — digita à esquerda, olha à direita, repete — e o painel dividido é de propósito, não uma feature que esquecemos de tornar colapsável.

Os dois botões de exportação existem porque servem trabalhos genuinamente diferentes no nosso próprio fluxo. Copiar HTML é o que usamos para entregar — colar num CMS, anexar a um e-mail, jogar num site estático — e o DOMPurify está no meio desse cano para que não sejamos as pessoas que introduziram um buraco de XSS num site de marketing. A cópia em Markdown é para arquivar a fonte, a versão que você de fato quer guardar para quando o HTML renderizado inevitavelmente precisar ser regerado com um stylesheet novo seis meses depois.

Sobre Editor Markdown

Este Editor Markdown é um ambiente de escrita ao vivo com dois painéis: digite Markdown à esquerda e veja a pré-visualização HTML renderizada se atualizar em tempo real à direita. Quando estiver satisfeito com a saída, pode copiar o Markdown, copiar o HTML renderizado ou baixar o HTML como arquivo independente, pronto para ser colocado em um site ou compartilhado por e-mail.

Ele suporta Markdown no estilo do GitHub — títulos, listas, tabelas, blocos de código com cercas, blockquotes, links, imagens, HTML inline e quebras de linha leves — através da biblioteca marked, com a saída sanitizada pelo DOMPurify para que o HTML que você copia seja seguro de embutir sem abrir brechas de XSS.

Tudo roda no seu navegador. Não há conta, salvamento automático em servidor nem upload de arquivos — seus rascunhos de notas, posts de blog, READMEs e atas de reunião nunca saem da sua máquina. Atualizar a página apaga o editor, então trate-o como um rascunho rápido, não como armazenamento de longo prazo.

Como usar Editor Markdown

Clique no painel do editor e comece a escrever Markdown. Um documento inicial é fornecido para que você veja como cada construção é renderizada.
Dê uma olhada no painel de pré-visualização para conferir se títulos, links, listas e imagens estão como você queria.
Alterne o layout entre Ambos, Apenas editor e Apenas pré-visualização conforme você esteja escrevendo, revisando ou apresentando.
Use Copiar Markdown para pegar a fonte bruta, ou Copiar HTML para pegar o HTML renderizado e sanitizado.
Clique em Baixar HTML para salvar a pré-visualização como um arquivo .html independente, que você pode anexar a um e-mail ou abrir no navegador.
Atualize a página para começar um documento novinho — não há salvamento automático, de propósito.

Casos de uso comuns

Rascunhar arquivos README do GitHub, descrições de issues ou corpos de pull request fora da interface do GitHub.
Escrever posts de blog em Markdown e exportar HTML limpo para um site estático ou plataforma de newsletter que não entende Markdown diretamente.
Preparar release notes ou changelogs e pré-visualizar exatamente como a formatação ficará antes de colar no Slack, Notion ou em um CMS.
Ensinar Markdown — alunos podem experimentar a sintaxe e ver o resultado renderizado lado a lado sem instalar nada.
Converter rapidamente um trecho de Markdown extraído da documentação em HTML para uso em um artigo de central de ajuda ou base de conhecimento.

Dicas e erros comuns

Use quatro espaços ou uma tabulação para aninhar itens de lista; uma indentação inconsistente é o motivo mais comum para uma lista aninhada virar uma lista plana na pré-visualização.
Blocos de código com cercas (```linguagem) recebem nomes de classe com a tag da linguagem na saída HTML — conecte-os a um destacador de sintaxe como Prism ou highlight.js no seu próprio site para ter código colorido.
HTML inline é permitido e renderizado, então você pode usar <kbd>, <details> ou qualquer outra tag que o Markdown não cobre nativamente. O DOMPurify ainda assim remove atributos perigosos e tags de script da saída.
Quando você copia o HTML, recebe um fragmento, não um documento completo. Envolva-o em uma casca <html><body> com sua própria folha de estilos antes de salvar como uma página polida.

Perguntas frequentes

Qual sabor de Markdown é suportado?

GitHub-flavored Markdown via a biblioteca marked — títulos, listas, tabelas, blocos de código cercados, citações, links, imagens, HTML inline, quebras de linha suaves e mais.

O HTML resultante é seguro para incorporar no meu site?

Sim. Sanitizamos com DOMPurify, que remove atributos perigosos e scripts. Você pode colar o resultado em qualquer página sem risco de XSS.

Meu Markdown é salvo ou enviado?

Não. Tanto a renderização quanto o download acontecem localmente no seu navegador. Recarregar a página limpa o editor.

Posso adicionar meu próprio CSS à pré-visualização?

A pré-visualização interna usa a tipografia padrão do site. Para estilizar a saída no seu próprio site, copie o HTML e combine-o com a folha de estilos que você já usa — a marcação é HTML semântico simples, então qualquer CSS amigável a Markdown funciona.

O editor suporta tabelas e listas de tarefas?

Sim. Tabelas Markdown no estilo do GitHub (com pipes e traços) e itens de lista de tarefas (- [ ] / - [x]) renderizam corretamente na pré-visualização e sobrevivem ao HTML exportado.

Posso importar um arquivo Markdown existente?

Abra o arquivo em qualquer editor de texto, copie o conteúdo e cole-o no painel do editor. Não há seletor de arquivos, o que mantém a ferramenta totalmente offline e evita o atrito dos diálogos de upload para trechos curtos.