Qual é o problema?
Sua imagem OG é muito pequena para uma ou mais plataformas de redes sociais. Quando uma imagem não atinge as dimensões mínimas de uma plataforma, ela pode aparecer como um thumbnail minúsculo, ser ampliada demais (ficando pixelada) ou não ser mostrada.
Como fica
❌ Imagem pequena (256×256px)
✅ Tamanho correto (1200×630px)
Dimensões mínimas por plataforma
Cada plataforma tem requisitos mínimos diferentes:
| Plataforma | Tamanho mínimo | Recomendado | Comportamento quando muito pequena |
|---|---|---|---|
| 200x200px | 1200x630px | Recorre a pré-visualização pequena de link | |
| X (Twitter) | 300x157px | 1200x628px | Pode não exibir a imagem |
| 1200x628px | 1200x628px | Mostra formato de card menor | |
| ~300x200px | 1200x630px | A imagem pode não aparecer | |
| Slack | ~400x200px | 1200x630px | Mostra thumbnail minúsculo |
| Discord | 256x256px | 1200x630px | Renderiza embed pequeno |
| Telegram | Sem mín. rígido | 1200x630px | Pode cortar de forma estranha |
Como corrigir
Redimensione a imagem para o recomendado universal de 1200x630px (proporção 1.91:1):
<meta property="og:image" content="https://yoursite.com/og-image.jpg" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />Causas comuns
1. Usar um logo ou ícone como imagem OG
Logos costumam ser pequenos (por exemplo, 256x256). Crie uma imagem OG dedicada que inclua o logo em um canvas 1200x630.
2. Usar um thumbnail em vez da imagem completa
Plataformas de CMS às vezes geram thumbnails pequenos. Certifique-se de que a URL de og:image aponta para a versão em resolução completa.
3. Imagens geradas dinamicamente em baixa resolução
Se você usa um serviço como @vercel/og ou Satori, garanta que as dimensões de saída estejam em 1200x630.
Correção rápida com ferramentas de design
- Figma — Crie um frame em 1200x630px
- Canva — Use a categoria de template “Social Media”
- Squoosh — Redimensione imagens existentes para as dimensões certas
Exemplo de automação
Sharp (Node.js):
import sharp from 'sharp'
await sharp('small-image.png')
.resize(1200, 630, { fit: 'cover' })
.jpeg({ quality: 85 })
.toFile('og-image.jpg')