Editor Markdown gratuito

Escreva Markdown com uma pré-visualização HTML em tempo real.

Nenhum dado sai do seu dispositivo
Entrada Markdown
Pré-visualização HTML
0
Palavras
0
Caracteres
0
Linhas

Como usar

  1. Digite ou cole texto Markdown no painel da esquerda. O painel da direita exibe a pré-visualização HTML em tempo real.
  2. Use os botões da barra de ferramentas para inserir rapidamente formatação (negrito, itálico, títulos, links etc.).
  3. Visualize os números de palavras, caracteres e linhas abaixo do editor.
  4. Baixe seu Markdown como arquivo .md ou copie a saída HTML.

Perguntas frequentes

Este editor suporta a sintaxe Markdown padrão ?

Sim. Ele suporta títulos, negrito, itálico, links, imagens, blocos de código, listas, citações e linhas horizontais. Um analisador Markdown simplificado faz a renderização em HTML em tempo real.

Posso salvar meu trabalho ?

O editor salva automaticamente seu texto na memória do navegador enquanto você edita. Use Baixar .md para salvá-lo como arquivo no seu computador.

Como inserir um link ou uma imagem ?

Use os botões da barra de ferramentas. Para links, digite [texto](url). Para imagens, use ![alt](url). A pré-visualização é atualizada instantaneamente.

Uma breve história do Markdown

O Markdown foi criado em março de 2004 por John Gruber, o escritor por trás do Daring Fireball, com a colaboração significativa de Aaron Swartz (o polímata que mais tarde cofundou o Reddit e foi coautor da spec do RSS 1.0). O objetivo de design declarado (escrito na página de sintaxe original) era «torná-lo o mais legível possível». O Gruber queria um formato de texto simples que fosse publicável como está, parecendo natural em um terminal ou em um editor de texto simples sem nenhuma renderização. O formato formalizou o que as pessoas já faziam em e-mails de texto simples e posts da Usenet: *asterisks for emphasis*, > for quoted text, linhas em branco entre os parágrafos.

O nome é um trocadilho com «markup language» (linguagem de marcação): o Markdown é tão leve que «marca para baixo» (mark down) em vez de marcar para cima. O núcleo filosófico que o distingue do HTML: o código-fonte do HTML é para máquinas, o código-fonte do Markdown é para humanos. Um arquivo .md deveria ser perfeitamente confortável de ler em um terminal sem nenhuma renderização aplicada.

A página de sintaxe original do Gruber deixou muitos casos extremos ambíguos, e ao longo do fim dos anos 2000 todo projeto que precisava de um parser de Markdown escreveu o seu próprio, tomando decisões diferentes sobre as partes não especificadas. No início dos anos 2010, o mesmo arquivo .md era renderizado de forma visivelmente diferente no Reddit, no GitHub, no Stack Overflow e em um blog Jekyll. Em 2014, um grupo de trabalho que incluía Jeff Atwood (Stack Overflow, Discourse), John MacFarlane (Pandoc) e engenheiros do GitHub, do Reddit e do Meteor produziu uma spec rigorosa, originalmente chamada de «Standard Markdown», renomeada para CommonMark depois que o Gruber objetou. O CommonMark publica tanto uma prosa legível por humanos quanto uma suíte de testes legível por máquina com mais de 600 testes de casos extremos; a versão atual é a 0.31.2 (janeiro de 2024). GitHub, GitLab, Reddit, Stack Overflow, Discourse e dezenas de linguagens de programação agora alegam conformidade.

Sintaxe comum

Esta é a sintaxe que funciona em quase todo sabor de Markdown, a base prática que este editor suporta.

O que você querComo escrever
Título# H1 até ###### H6
Negrito / itálico**bold** · *italic* · ***both***
Código inline`code`
Bloco de códigoCercado com três crases; tag de idioma opcional para realce de sintaxe
Lista não ordenada- item (ou * ou +)
Lista ordenada1. first: os números em si geralmente não importam
Link[text](https://example.com)
Imagem![alt text](image.jpg): o texto alternativo importa para a acessibilidade
Citação> quoted text
Linha horizontal--- sozinho em uma linha

Duas ciladas comuns: uma única quebra de linha não cria uma quebra de linha: você precisa de uma linha em branco para um novo parágrafo, ou de dois espaços ao final antes da quebra de linha (ou, no GFM, de uma barra invertida) para uma quebra de linha forçada dentro de um parágrafo. E o Markdown é um superconjunto do HTML: quaisquer tags HTML inline passam para a saída renderizada, o que ocasionalmente é útil e ocasionalmente um risco de segurança.

GitHub Flavored Markdown e outros sabores

O GFM é o superconjunto do CommonMark do GitHub. Ele acrescenta tabelas (linhas delimitadas por barras verticais com um separador de hífen), itens de lista de tarefas (- [ ] desmarcado, - [x] marcado), tachado (~~text~~), detecção automática de URL e um filtro de «HTML bruto não permitido» que remove tags perigosas. O próprio GitHub também renderiza alguns extras fora da spec, atalhos de emoji (:tada:), @mentions, autolinks de issue #123, callouts de alerta (> [!NOTE]), seções <details> recolhíveis, mas esses são recursos de renderização do GitHub, e não partes da spec do GFM.

Outros sabores que você vai encontrar:

Onde o Markdown vive

Em praticamente todo lugar onde os desenvolvedores escrevem texto:

O Markdown também é um tipo de mídia IETF registrado (text/markdown, RFC 7763, março de 2016) com um parâmetro variant (GFM, CommonMark, MultiMarkdown etc.) para que os receptores saibam qual sabor aplicar. Extensões de arquivo comuns: .md de longe a mais popular, mais .markdown, .mdown, .mkdn, .mkd.

Uma nota sobre o parser deste editor

Esta página usa um parser de Markdown simplificado que cobre o subconjunto comum acima, títulos, negrito e itálico, links, imagens, código cercado, listas, citações e réguas horizontais. Não é uma implementação completa de CommonMark ou GFM e pode não lidar com todos os casos extremos (listas profundamente aninhadas com marcadores mistos, continuação preguiçosa de linha, definições de referência de link ao longo do documento). Para uma conformidade com o CommonMark de missão crítica, um parser dedicado como o marked.js, o markdown-it ou o commonmark.js é a escolha certa, e para a renderização em produção de Markdown não confiável, passe a saída do parser por um sanitizador como o DOMPurify para evitar XSS através de HTML inline.

Quando você recorreria a isto

Mais perguntas

Por que uma única quebra de linha não cria uma nova linha?

Por design. O Markdown colapsa as quebras de linha únicas em um parágrafo contínuo porque o formato deve parecer natural como texto simples, os leitores quebram em larguras arbitrárias no seu editor sem quebrar a saída renderizada. Para forçar uma quebra de linha dentro de um parágrafo, termine uma linha com dois espaços ao final (a convenção original do Markdown) ou, no GFM, uma barra invertida. Para um novo parágrafo, deixe uma linha em branco entre os dois.

Posso usar HTML dentro do Markdown?

Sim, o Markdown é um superconjunto do HTML. Tags inline como <span>, <a>, <sub> e <sup> passam para a saída renderizada, e a sintaxe Markdown dentro delas ainda é reconhecida. O HTML de nível de bloco (<div>, <table>) precisa ser separado do Markdown ao redor por linhas em branco, e o Markdown não é processado dentro do bloco. Use isto para coisas que o Markdown não consegue expressar nativamente: dimensões de imagem (<img width="…">), chips de teclado (<kbd>) ou seções recolhíveis (<details>).

E quanto a tabelas, notas de rodapé e listas de tarefas?

Os três são extensões do GFM, não parte da spec original do Markdown. As tabelas usam linhas delimitadas por barras verticais com uma linha separadora de hífen embaixo; o parser simplificado desta página pode renderizá-las como texto simples. As notas de rodapé (referência [^1] e definição [^1]: definition) são um recurso de renderização do GitHub fora da spec GFM propriamente dita. As listas de tarefas (- [ ] e - [x]) estão no GFM. Para uma cobertura completa delas, cole o seu arquivo em um renderizador compatível com CommonMark+GFM como a própria pré-visualização do GitHub.

Por que o texto alternativo é obrigatório nas imagens?

Porque o texto alternativo é o que os leitores de tela anunciam quando encontram a imagem, é o principal gancho de acessibilidade para leitores com deficiência visual. ![image1.png](url) é tecnicamente Markdown válido, mas inútil para um leitor de tela; ![Annual revenue chart, 2020 to 2025](url) é genuinamente descritivo. Pular o texto alternativo ou preenchê-lo com um nome de arquivo é uma das falhas de acessibilidade mais comuns em todo o conteúdo da web.

Algo é enviado a um servidor?

Não. O editor analisa o Markdown e o transforma em HTML no navegador, a pré-visualização ao vivo é atualizada localmente, e o salvamento automático usa o localStorage do seu navegador: um pequeno armazenamento privado no seu dispositivo. Nada sai da página. O editor funciona offline depois de carregado.

Ferramentas relacionadas

Conversor de Markdown para HTML Visualizador gratuito de Markdown on-line Gerador de tabelas Markdown