Conversor Markdown para HTML — Converta Markdown em HTML online _

O que é a conversão Markdown para HTML?

Markdown é um formato leve de texto puro que usa pontuação mínima (# para cabeçalhos, * para ênfase, - para itens de lista) para codificar prosa estruturada. GitHub Flavored Markdown (GFM) estende a especificação CommonMark original com tabelas, riscado, listas de tarefas e autolinks. HTML é a forma renderizada que o navegador exibe. Converter Markdown em HTML permite que você escreva na sintaxe leve e publique para uma superfície renderizada — um README, uma página de site estático, o corpo de um e-mail — sem escrever as tags manualmente.

Quais recursos do GitHub Flavored Markdown são suportados?

O parser embutido marked@12.0.2 suporta o superconjunto GFM completo: cabeçalhos estilo ATX de # a ######, listas ordenadas e não ordenadas com aninhamento, negrito **texto** e itálico *texto*, riscado ~~texto~~, links inline [texto](url) e imagens inline ![alt](src), blocos de código com cercas e tag de linguagem opcional (```js), spans de código inline `code`, tabelas com barras e linha de cabeçalho, listas de tarefas GFM - [ ] / - [x], citações >, regras horizontais --- e autolinks. Cada um renderiza no painel de pré-visualização da mesma forma que o GitHub renderiza.

Como funciona a conversão Markdown para HTML?

Cada conversão roda localmente no seu navegador usando duas bibliotecas embutidas — sem CDN, sem fetch, sem telemetria. Os passos principais são:

1. Analisar: marked.parse(source) lê seu Markdown e produz uma string HTML. O parser roda em modo GFM, por isso tabelas, listas de tarefas, riscado e autolinks são todos reconhecidos.
2. Sanitizar: a saída HTML passa por DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }) antes de ser atribuída a innerHTML. DOMPurify é o mesmo sanitizador XSS usado pela Mozilla MDN, Atlassian e Microsoft 365 — ele analisa o HTML, percorre o DOM e remove elementos <script>, todos os atributos manipuladores on* e esquemas URI javascript:.
3. Renderizar: o HTML sanitizado é escrito no painel de pré-visualização via innerHTML, e o HTML bruto é exibido no segundo painel via um <textarea> somente leitura para que você possa copiar o markup. O modo ao vivo aplica debounce de 150 ms à entrada para que a pré-visualização atualize enquanto você digita sem sobrecarregar o parser.

Por que converter Markdown para HTML com esta ferramenta?

• Privacidade: cada passagem de análise, sanitização e renderização acontece no seu navegador. O Markdown — incluindo posts de blog não publicados, rascunhos de documentação interna e conteúdo README confidencial — nunca chega aos nossos servidores.
• Seguro contra XSS por padrão: o painel de pré-visualização renderizada passa cada string HTML por DOMPurify antes de innerHTML, então uma tag <script> ou manipulador onerror= dentro do HTML bruto no seu Markdown produz uma pré-visualização inerte. A aba bruta mostra a saída não sanitizada para inspeção, dentro de um <textarea> via value — nunca executada.
• GFM completo: tabelas, riscado, listas de tarefas e autolinks renderizam da forma que o GitHub renderiza. Uma tabela Markdown com barras se torna um <table> HTML com <thead> e <tbody> — sem linhas perdidas, sem estrutura achatada.

Quais são as aplicações comuns da conversão Markdown para HTML?

Converter Markdown em HTML aparece em documentação, trabalho com sites estáticos e criação de e-mails:

• Criação de README no GitHub: rascunhar um README de projeto localmente como Markdown e pré-visualizá-lo antes de fazer push. A pré-visualização combina com o renderizador GFM do GitHub para tabelas, listas de tarefas e código com cercas.
• Conteúdo para site estático: colar um post em Markdown e pegar o HTML para um campo de CMS ou motor de templates que espera markup em vez de fonte Markdown.
• Modelos de e-mail: escrever o corpo de um e-mail transacional como Markdown e convertê-lo para HTML para o motor de templates do provedor de e-mail. A saída é HTML semântico simples — sem estilos inline, sem peculiaridades de cliente de e-mail embutidas.

Como se parece um exemplo de conversão Markdown para HTML?

Colar # Título\n\n- item 1\n- item 2\n\n[link](https://example.com) produz um painel de pré-visualização contendo <h1>Título</h1>, uma lista não ordenada de dois itens e um <a href="https://example.com">link</a>. A aba bruta mostra a string HTML exata para que você possa copiá-la diretamente em um template. Uma tabela com barras com linha de alinhamento |---|---| se torna um <table> completo com <thead> e <tbody> — confirmando que as tabelas GFM renderizam da forma que o GitHub renderiza.

Este conversor Markdown para HTML roda inteiramente no meu navegador?

Sim. Cada passagem de análise, sanitização e renderização roda localmente como JavaScript dentro da aba do seu navegador. As bibliotecas embutidas — marked@12.0.2 e DOMPurify@3.1.7 — são entregues da mesma origem que a página, então não há dependência de CDN, nem fetch, nem XMLHttpRequest, nem navigator.sendBeacon sobre a entrada. A ferramenta também funciona offline depois que a página carrega, porque é um bundle estático HTML/CSS/JS com as bibliotecas vendor copiadas ao lado. Posts não publicados, documentos internos e READMEs confidenciais permanecem no seu dispositivo.

O painel de pré-visualização renderizada é seguro contra XSS?

Sim. Cada string HTML atribuída a innerHTML passa primeiro por DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }). DOMPurify é o sanitizador XSS open-source mantido pela Cure53; é a mesma biblioteca usada pela Mozilla MDN, Atlassian e Microsoft 365 para reforçar HTML fornecido pelo usuário. O perfil html padrão remove elementos <script>, todo atributo manipulador de evento on* (onerror, onclick, etc.), esquemas URI javascript: dentro de href / src e expressões CSS conhecidas como perigosas. Colar <img src=x onerror=alert(1)> produz uma pré-visualização onde document.querySelector('#output-preview img[onerror]') retorna null e nenhum alerta dispara.

Tabelas GFM são suportadas?

Sim. A direção Markdown → HTML lida com tabelas com barras nativamente via modo GFM do marked — uma linha de cabeçalho separada por uma linha de alinhamento |---|---|, seguida por linhas de dados, produz uma <table> com <thead> + <tbody>. Riscado (~~texto~~ → <del>texto</del>) e listas de tarefas (- [ ] / - [x] → <input type="checkbox">) renderizam da mesma forma que o GitHub.

Meu Markdown é convertido fielmente?

Para o conjunto canônico de recursos GFM — cabeçalhos h1 a h6, listas ordenadas e não ordenadas com aninhamento, negrito / itálico / riscado, links inline, imagens inline, blocos de código com cercas e tags de linguagem, spans de código inline, tabelas com barras, listas de tarefas, citações, regras horizontais e autolinks — a saída HTML é estável e combina com o renderizador do GitHub. Alguns comportamentos a notar: o HTML inline bruto dentro do Markdown (ex.: <sub>texto</sub>) passa sem alteração para a saída, e os cabeçalhos setext de CommonMark (sublinhados ===) e os cabeçalhos ATX (# Título) produzem o mesmo <h1>. São comportamentos documentados do marked, não bugs. Se precisar da direção inversa, use a ferramenta HTML para Markdown.

O destaque de sintaxe em blocos de código com cercas é suportado?

Não na v1. Blocos de código com cercas renderizam com fonte monoespaçada e um fundo sutil, mas sem destaque de tokens por linguagem. Adicionar destaque de sintaxe exigiria incluir Prism ou highlight.js, cada um adicionando 15–40 KB mais um arquivo de gramática por linguagem e uma matriz de temas que precisaria alinhar com a paleta Workshop Terminal. Por enquanto, o renderizador foca em correção e segurança XSS; se houver demanda dos usuários por destaque inline, um interruptor opcional é um próximo passo viável.

Este Conversor Markdown para HTML vem com marked@12.0.2 e DOMPurify@3.1.7 embutidos na mesma origem, suporta o conjunto completo de recursos GFM e sanitiza cada string HTML renderizada antes que toque no DOM. Sem upload, sem CDN, sem telemetria — cada byte permanece no seu navegador.