Pular para o conteúdo

Converter Markdown em HTML

Transforme Markdown em uma página web completa e caprichada, ou em HTML limpo para colar em um blog ou CMS — com tabelas no estilo do GitHub, código destacado e títulos com link.

  • Nunca armazenado
  • Sem fila, sem espera
  • Sem cadastro, sem marca d'água

Não tem um arquivo à mão?

Como funciona

1

Adicione o Markdown

Solte um arquivo .md, ou escreva e cole direto no editor.

2

Escolha o resultado

Uma página completa e estilizada que abre em qualquer lugar, ou só o HTML para o seu próprio site.

3

Copie ou baixe

Copie o HTML para a área de transferência ou salve como arquivo .html.

Um fragmento ou uma página, e qual você quer

Existem dois resultados úteis, e um não substitui o outro. Um fragmento é só a marcação convertida — títulos, parágrafos, listas, links — sem a estrutura de documento, que é o que você quer quando o resultado vai para um template, um campo de CMS ou outra página. Uma página completa acrescenta o doctype, um head, a declaração do conjunto de caracteres e uma folha de estilos, então abre sozinha e já tem boa aparência. Colar uma página completa em um CMS gera um documento dentro de outro documento; abrir um fragmento no navegador mostra texto sem estilo.

A conversão cobre o conjunto estendido de Markdown amplamente aceito: títulos, ênfase, listas, links, imagens, citações, tabelas, blocos de código com destaque de sintaxe, listas de tarefas, texto riscado e notas de rodapé. Os títulos recebem identificadores derivados do próprio texto, então dá para criar links direto para eles — as âncoras que tornam uma documentação longa usável.

O HTML bruto dentro do Markdown passa adiante, o que faz parte da especificação e merece atenção: significa que um arquivo Markdown de origem não confiável pode conter uma tag script, e convertê-lo gera uma página com esse script. Nunca renderize Markdown de desconhecidos sem sanitizar o HTML depois — a conversão não é uma barreira de segurança e nunca teve essa intenção.

Duas coisas saem como blocos de código em vez de renderizadas, de propósito. Fórmulas matemáticas em notação LaTeX precisam de uma biblioteca de composição tipográfica, e diagramas Mermaid precisam de um renderizador de diagramas — cada um é uma dependência considerável, e uma equação renderizada errado é pior do que uma que aparece como código. Uma página completa usa fontes comuns do sistema em vez de baixar alguma, então funciona offline e fica um pouco diferente no Windows, no macOS e no Linux.

Quando você precisa de outra coisa

O Pandoc faz o que ficou de fora aqui e muito mais: pandoc in.md -o out.html --mathjax --standalone --toc renderiza matemática direito, gera um sumário e aceita um template para o resultado combinar com o seu próprio site. Ele também converte de e para cerca de quarenta outros formatos, e por isso vale a pena instalar uma vez.

Para um site, e não um arquivo, use um gerador em vez de converter página por página. Hugo, Eleventy, Jekyll e MkDocs transformam uma pasta de Markdown em um site com navegação, busca e estilo consistente, e o reconstroem sempre que o conteúdo muda — que é o trabalho de verdade sempre que existe mais de um documento.

Perguntas frequentes

Página completa ou trecho de HTML — qual eu quero?

Uma página completa é um único arquivo .html com estilo próprio, que fica bonito aberto da sua área de trabalho, no celular ou impresso. Um trecho é só a marcação do conteúdo, sem estilos, para colar no WordPress, no Ghost, em um CMS ou no seu próprio template.

Quais recursos do Markdown são aceitos?

Markdown no padrão do GitHub: tabelas com alinhamento, listas de tarefas, texto riscado, links automáticos, blocos de código com destaque de sintaxe, notas de rodapé e HTML embutido. Os títulos recebem ids no estilo do GitHub, então links como #installation continuam funcionando.

Meu texto fica armazenado em algum lugar?

Não. Nada é enviado para lugar nenhum e nada fica armazenado.

O que acontece com as minhas imagens?

Os caminhos das imagens ficam exatamente como você escreveu, então a página funciona quando salva ao lado da sua pasta de imagens. Solte as imagens também e elas são incorporadas ao arquivo, que passa a funcionar sozinho.

O HTML é seguro para publicar?

Scripts, formulários, frames incorporados e manipuladores de eventos inline são removidos de qualquer HTML dentro do seu Markdown, então o resultado só contém formatação.

Dá para adicionar um sumário?

Sim — marque “Sumário”, ou coloque [TOC] sozinho em uma linha onde você quer que a lista apareça.

Bom saber: Fórmulas matemáticas e diagramas Mermaid saem como blocos de código, sem ser renderizados. Uma página completa usa fontes de sistema seguras para a web, então fica um pouco diferente no Windows, no macOS e no Linux.

Coloque esta ferramenta no seu site

Grátis para qualquer blog, página de turma ou artigo de ajuda. Cole um único trecho de código e seus visitantes podem usá-la direto na sua página.