Para onde o HTML vai
Markdown é agradável de escrever, mas muitos destinos só aceitam HTML: a visualização de código-fonte do editor de um CMS, um modelo de e-mail, o campo de descrição de produto numa loja online, um portal de documentação sem suporte a Markdown ou uma página estática que você está montando à mão. Converter aqui dá a você a marcação para colar em qualquer um deles, e a pré-visualização permite conferir o resultado antes de ele ir ao ar.
A conversão usa o dialeto GitHub Flavored Markdown, então um texto escrito para um README, para a descrição de um pull request ou para um app de notas como o Obsidian se comporta aqui do mesmo jeito que lá.
Como fica a saída
O conversor gera um fragmento do corpo: os elementos em si, sem <html>, <head> nem estilos. Vale conhecer alguns detalhes antes de colá-lo em algum lugar:
- Os títulos não têm atributos
id.## Preçosvira<h2>Preços</h2>. Se você precisa de links de âncora para um sumário, acrescente os ids você mesmo. - Blocos de código levam uma classe de linguagem. Uma cerca aberta com
`pythongera<pre><code class="language-python">, que realçadores como Prism e highlight.js reconhecem automaticamente. Caracteres como<e&dentro do código são escapados. - Listas de tarefas viram itens de lista com caixas de seleção desativadas, do mesmo jeito que o GitHub as renderiza.
- Tabelas viram marcação
<table>simples, com<thead>e<tbody>. O alinhamento de colunas definido com dois-pontos na linha separadora é escrito como um atributoalign. - Nenhum estilo é incluído. A pré-visualização aplica uma folha de estilos leve para você conseguir ler, mas o HTML copiado herda o CSS que a página de destino tiver.
O download embrulha o fragmento numa página mínima independente: um documento <!doctype html> com <meta charset="utf-8"> e um <title> tirado do primeiro título, para que letras acentuadas e outros textos fora do ASCII apareçam corretamente quando o arquivo é aberto do disco. Ele não acrescenta estilos, então a página usa os padrões do navegador.
Quebras de linha e outras surpresas
A maior parte da confusão com Markdown vem de um punhado de regras que diferem de um editor de texto:
- Uma única quebra de linha não é uma linha nova. Duas linhas escritas uma embaixo da outra se juntam num só parágrafo. Deixe uma linha em branco para começar um novo parágrafo, ou termine uma linha com dois espaços ou uma barra invertida para forçar um
<br>. Alguns editores, incluindo os comentários do GitHub, tratam quebras simples como quebras de linha; este conversor segue o comportamento padrão usado nos arquivos README do GitHub e na maioria dos geradores de sites estáticos. - Front matter não é reconhecido. Um bloco YAML entre linhas
---no topo de um arquivo é renderizado como uma linha horizontal seguida de texto, e o---de fechamento pode transformar a linha acima dele num título. Remova o front matter antes de converter. - Notas de rodapé, fórmulas matemáticas e diagramas não fazem parte do dialeto.
$x^2$continua como texto literal e um bloco Mermaid vira um bloco de código simples. A sintaxe de notas de rodapé é pior do que ignorada: uma definição como[^1]: notaé lida como referência de link, então o marcador vira um link que aponta para a palavranota. - As aspas continuam retas. Aspas e travessões tipográficos não são inseridos; o que você digita é o que você recebe.
- Uma lista numerada que não começa em 1 não pode começar logo abaixo de um parágrafo. Linhas como
3. trêssão absorvidas pelo texto do parágrafo, a menos que uma linha em branco as separe. Listas com marcadores e listas que começam em 1 não têm esse problema.
HTML bruto e segurança
O Markdown permite HTML bruto, e este conversor o deixa passar sem alteração. Um bloco <details> ou um <span style> que você escreveu à mão aparece na saída exatamente como foi escrito. Isso é útil, mas também significa que a saída não é higienizada: uma tag <script> ou um atributo onerror na origem vai estar presente no HTML copiado.
A pré-visualização em si roda num quadro isolado (sandbox) com scripts desativados, então visualizar aqui um Markdown não confiável é seguro. Colar o HTML resultante no seu próprio site é outra história. Se o Markdown veio de usuários ou de outra fonte não confiável, passe o HTML por um sanitizador do seu lado antes de publicá-lo.
Conversões relacionadas
Para fazer o caminho inverso, de uma página web ou de uma exportação de CMS de volta para Markdown, use o HTML para Markdown. Para documentos do Word, o DOCX para Markdown gera um Markdown que você pode depois visualizar e converter aqui. Tudo roda no seu navegador enquanto você digita, então rascunhos e documentação interna nunca são enviados a um servidor.