Slides de Markdown

Por que usar Markdown para slides?

O PowerPoint e o Keynote são excelentes no design de slides e ruins em quase todo o resto. São difíceis de versionar, difíceis de comparar com diff, difíceis de editar no celular, difíceis de manter consistentes em uma equipe e impossíveis de pesquisar com grep. O Markdown resolve o «todo o resto» sem tentar competir no design visual, e para conteúdo técnico (amostras de código, saída de terminal, tutoriais de linha de comando, listas de marcadores) é mais rápido de escrever do que qualquer ferramenta gráfica.

O formato é texto simples, então ele vive nativamente no git, abre em qualquer editor, edita em qualquer ferramenta, do VS Code ao vim ou a um app de notas de celular, e sobrevive a 30 anos de mudanças de software. A contrapartida: você abre mão do controle de design pixel-perfeito. Para reuniões gerais de desenvolvedores, palestras de conferência, apresentações de tutorial de README, material de sala de aula e lightning talks, essa é uma ótima troca. Para pitches de vendas e apresentações de marketing, o PowerPoint ou o Figma provavelmente ainda vencem.

A convenção do ---

Três traços em sua própria linha são a sintaxe já existente do Markdown para uma régua horizontal, definida lá no CommonMark e reaproveitada como o separador de slides em todo o ecossistema de slides em Markdown, o reveal.js, o Marp, o Slidev e a maioria das ferramentas menores usam todos isso. A convenção é inequívoca (uma régua horizontal de verdade ainda funciona dentro de um único slide; o --- só divide quando está em sua própria linha) e fácil de digitar. Você escreve a apresentação como um único documento Markdown contínuo e a ferramenta a re-segmenta visualmente.

O ecossistema de slides em Markdown em 2026

• reveal.js (Hakim El Hattab, desde 2011), a biblioteca pioneira de apresentações baseadas em navegador. Grades de slides verticais e horizontais, transições, notas do apresentador (sintaxe Notes:), fonte Markdown via o atributo data-markdown. O nome mais conhecido; o slides.com o hospeda como SaaS.
• Marp: o projeto dedicado de Markdown para slides mais popular. Baseado em CommonMark, vem com uma CLI, uma extensão para o VS Code e o Marp Core. Excelente exportação para PDF. Frontmatter para tema e proporção.
• Slidev (Anthony Fu), mais novo (2021), baseado em Vue, moderno. Projetado para palestras de desenvolvedores: realce de código embutido, embutimento de código no slide, modo apresentador, desenho nos slides durante a palestra.
• remark.js (Ole Petter Bang), minimalista, embutível em arquivo único. Amado por não impor opiniões.
• HackMD: variante de edição colaborativa. Baseado em navegador, exige conta, sincroniza entre dispositivos.

Esta ferramenta preenche um nicho diferente: sem instalação, sem conta, sem upload. Cole, apresente, feche a aba. É a escolha certa quando você está preparando uma lightning talk de 5 minutos em um laptop emprestado, finalizando os slides em um voo, ou rascunhando em uma sala de reunião e não quer subir o Marp nem fazer login no slides.com.

Proporções explicadas

As apresentações de slides modernas são 16:9 por padrão, todo projetor de conferência construído na última década é uma superfície 16:9, e o 16:9 corresponde a toda tela de laptop e TV moderna. A viewport aqui renderiza em 16:9 para corresponder. Apresentações mais antigas usam 4:3 (a proporção original de um projetor CRT); laptops mais antigos às vezes vêm em 16:10. O padrão do PowerPoint é 16:9 desde a versão 2013; o Google Slides usa 16:9 por padrão na criação; o padrão do Keynote também é 16:9.

Casos de uso comuns

• Reuniões gerais de desenvolvedores e demo days. Conduza uma equipe por uma mudança de código, uma nova arquitetura ou uma retrospectiva de incidente.
• Palestras de conferências e meet-ups. Especialmente palestras para público técnico, onde a apresentação precisa de amostras de código que façam diff de forma limpa nos pull requests.
• Tutoriais de README. Uma introdução de 6 slides a uma biblioteca, embutida na documentação do projeto.
• Lightning talks. Palestras de 5 minutos e ~5 slides, onde a cerimônia é a inimiga.
• Material de sala de aula. Edite os slides ao vivo enquanto você ensina; os alunos podem copiar a fonte Markdown para as suas anotações.
• Treinamento interno. Apresentações de integração versionadas e revisadas em code review, ao lado da base de código que elas ensinam.
• Briefings pré-reunião. Pré-leituras de 3 slides enviadas como Markdown que o destinatário pode pré-visualizar no seu editor.

Princípios de design de slides que importam mesmo no Markdown

• Uma ideia por slide. A regra clássica. Se um slide tem dois pensamentos, divida-o.
• Menos texto, mais estrutura. Se um slide se lê como um parágrafo, o palestrante está lendo o slide. Reduza a marcadores e deixe o palestrante preencher a prosa.
• Fontes maiores do que você imagina. Os slides em Markdown usam, por padrão, um corpo de texto em torno do equivalente a 24-32 px. Qualquer coisa abaixo de ~18 px é ilegível do fundo de uma sala de conferência.
• Um H1 por slide. Vários títulos de nível superior no mesmo slide criam confusão visual.
• Mantenha os blocos de código curtos. Seis linhas é, mais ou menos, o máximo confortável em um slide 16:9. Trechos mais longos precisam ser divididos ou mostrados realçados em pedaços.
• Faça cada imagem merecer o seu lugar. Fotos de banco de imagens como decoração são enchimento. Diagramas, capturas de tela e visualizações de dados são sinal.

Privacidade

As apresentações de slides são frequentemente confidenciais, pitch decks, estratégia interna, números financeiros, demos de produto pré-lançamento. Esta ferramenta roda inteiramente no seu navegador: o Markdown fica na área de texto, a renderização acontece localmente, e a apresentação em tela cheia lê do mesmo estado na memória. Nada é enviado, nenhuma conta é exigida, e fechar a aba apaga tudo. As alternativas hospedadas em servidor (slides.com, HackMD, GitPitch) exigem confiança nas políticas de tratamento de dados do operador; esta remove a questão por completo.

Erros comuns

1. Colar parágrafos inteiros em um slide. Se a plateia o lê, ela não está ouvindo o palestrante. Divida em marcadores.
2. Níveis de título inconsistentes. Um slide titulado com H1, o seguinte com H2, parece desleixado. Escolha um nível para os títulos dos slides e mantenha-o.
3. Blocos de código longos demais para o projetor. Um trecho de 30 linhas é ilegível da fileira de trás. Mostre apenas as 5-10 linhas relevantes, com o resto substituído por // ....
4. Sem notas do apresentador. Os slides são o apoio de memória da plateia, não o seu. As notas do apresentador (nas ferramentas que as suportam) guardam os pontos de fala.
5. Esquecer a proporção do projetor. Se você criou em um laptop 16:10 e o local usa um projetor 4:3, o conteúdo é cortado.
6. Transições de slide demais. As animações entre os slides parecem requintadas em uma demo e tediosas durante uma palestra de 30 minutos. Use por padrão nenhuma transição ou um simples fade.
7. Usar uma fonte engenhosa que quebra na máquina do local. Fique com as fontes do sistema, sem serifa para o corpo, monoespaçada para o código.

Mais perguntas frequentes

Posso exportar os slides como PDF?

Sim, entre no modo tela cheia, depois use a função de Imprimir do seu navegador (Ctrl/Cmd + P) e escolha Salvar como PDF. A maioria dos navegadores imprime os slides renderizados, um por página de PDF. O resultado é um PDF de texto limpo (não uma imagem), então é pequeno e pesquisável.

E quanto ao realce de sintaxe para código?

Os blocos de código cercados renderizam com fonte monoespaçada e um leve fundo escuro, o que os torna legíveis no tema escuro de tela cheia. O realce de sintaxe por linguagem (palavras-chave do Python em uma cor, strings em outra) exige um framework de slides mais elaborado, como o reveal.js ou o Slidev. Para uma lightning talk rápida, raramente faz falta; para palestras longas e cheias de código, essas ferramentas se encaixam melhor.

Como eu embuto uma imagem?

Sintaxe de imagem padrão do Markdown: ![alt text](https://your-image-url.png). A imagem precisa ser alcançável a partir da web pública (ou da sua máquina local via uma URL file://, mas as URLs de arquivo podem ser bloqueadas em alguns navegadores). Para imagens sensíveis, use a sintaxe de link do Markdown para um arquivo local que você serve a partir de um pequeno servidor web local durante a palestra.

Isso funciona offline?

Depois que a página é carregada, sim, a renderização do Markdown e a navegação entre slides rodam localmente. As imagens externas não vão carregar sem rede, então embuta as imagens como URIs de dados ou hospede-as localmente se você for apresentar offline.

Posso usar o teclado durante a palestra?

Sim, as setas / a barra de espaço avançam, o backspace volta, o Escape sai da tela cheia, o F alterna a tela cheia. A maioria dos controles de apresentação (o apresentador sem fio padrão da Logitech etc.) emula as mesmas teclas de seta, então funcionam sem configuração.

Algo é enviado a um servidor?

Não. A renderização do Markdown, a segmentação de slides, a apresentação em tela cheia, tudo acontece no seu navegador. O conteúdo da sua apresentação não é enviado, registrado nem armazenado em nenhum lugar do lado do servidor. Fechar a aba apaga o conteúdo da área de texto.