Markdown Previewer
Escreva Markdown com sabor GitHub no lado esquerdo, veja o HTML renderizado ao vivo no lado direito — totalmente dentro do navegador.
65 words360 characters
Markdown previewer
Type Markdown on the left and see the rendered HTML here.
Links, inline code, and strikethrough all work.
- Bullet
- Task list item
- Another
A blockquote.
function hello(name: string) {
return `Hi, ${name}`;
}
| Format | Support |
|---|---|
| Tables | yes |
| GFM | yes |
What is Markdown Previewer?
Markdown é uma linguagem de marcação leve criada por John Gruber em 2004 que permite escrever texto formatado usando pontuação simples e fácil de ler — # para títulos, ** para negrito, _ para itálico, - para listas e > para citações em bloco — que um conversor transforma em HTML. O GitHub-Flavored Markdown (GFM) estende a especificação original com os recursos que os desenvolvedores usam diariamente: tabelas, blocos de código cercados com dicas de linguagem, riscado, listas de tarefas e vinculação automática de URLs. Markdown é o formato de fato para arquivos README, sites de documentação, rastreadores de problemas, aplicativos de bate-papo e geradores de sites estáticos porque a fonte permanece legível mesmo antes de ser renderizada. Este visualizador analisa sua entrada ao vivo no navegador usando a biblioteca marked, sem uma viagem de ida e volta ao servidor, então você pode iterar em um documento e copiar o HTML resultante no momento em que ele fica correto.
How to Use Markdown Previewer
- Digite ou cole Markdown no painel esquerdo — o painel direito é renderizado novamente a cada pressionamento de tecla.
- Use # para títulos, **negrito**, _itálico_, - para listas, > para citações e blocos cercados por três backticks para código.
- Tabelas, listas de tarefas e riscado funcionam fora da caixa por meio do GitHub-Flavored Markdown.
- Clique em "Copiar HTML" para copiar a saída renderizada ou "Limpar" para começar novamente a partir de um documento em branco.
Examples
Título e parágrafo
Input: # Título Um parágrafo curto.
Output: <h1>Título</h1> <p>Um parágrafo curto.</p>
Negrito e itálico
Input: **negrito** e _itálico_
Output: <p><strong>negrito</strong> e <em>itálico</em></p>
Lista de tarefas
Input: - [x] feito - [ ] para fazer
Output: <ul> <li><input checked="" disabled="" type="checkbox"> feito</li> <li><input disabled="" type="checkbox"> para fazer</li> </ul>
Common Mistakes
- Esquecer que uma quebra de linha única se torna um espaço, não uma quebra de linha — adicione dois espaços no final ou uma linha em branco para forçar uma quebra.
- Esperar que a indentação de quatro espaços crie um bloco de código quando os blocos de código cercados (três crases) são mais confiáveis e suportam dicas de linguagem.
- Colar Markdown que contém tags <script> ou <iframe> brutos em uma página confiável sem sanitizar primeiro — a pré-visualização renderiza HTML inline de forma literal e é apenas para pré-visualização.
- Pular níveis de cabeçalho (pular de # para ###), o que produz um esboço de documento ruim e prejudica a navegação de leitores de tela e o SEO.
Why Use This Tool
- Pré-visualização ao vivo, keystroke por keystroke, sem upload e sem dependência de servidor.
- Markdown com sabor de GitHub completo, incluindo tabelas, listas de tarefas e riscado.
- Cópia de um clique do HTML renderizado para colar em qualquer CMS, e-mail ou modelo.
- Executa totalmente no lado do cliente, então continua funcionando mesmo após a rede cair.