<img src="placeholder.png" width="800" height="400" alt="Placeholder">Use width and height attributes to prevent layout shift (CLS)
background: #ccc url('placeholder.svg') center/cover;SVG placeholders are ideal for CSS backgrounds — infinitely scalable
<Image src="/placeholder.png" width={800} height={400} alt="..." />Use Next.js Image component for automatic optimization
<img src="data:image/png;base64,..." alt="Placeholder">Embed small placeholders directly in HTML — no extra HTTP request
| Caso de Uso | Dimensões | Rácio de Aspeto |
|---|---|---|
| Favicon / Icon | 64 × 64 | 1:1 |
| Avatar / Profile | 150 × 150 | 1:1 |
| Thumbnail | 300 × 200 | 3:2 |
| Blog Feature Image | 1200 × 630 | ~1.9:1 |
| Social Media OG | 1200 × 630 | ~1.9:1 |
| Hero Banner | 1920 × 600 | 16:5 |
| Full HD | 1920 × 1080 | 16:9 |
| Product Photo | 800 × 800 | 1:1 |
As imagens de marcador são utilizadas em desenvolvimento web e design para preencher espaços de imagem durante prototipagem, wireframing e desenvolvimento antes de as imagens finais estarem prontas. Ajudam a visualizar layouts e testar designs responsivos.
Sim, todas as imagens de marcador geradas por esta ferramenta são criadas localmente no seu browser e são gratuitas para qualquer finalidade, incluindo projetos comerciais.
PNG é um formato de imagem rasterizada baseado em píxeis, compatível com todos os browsers e aplicações. SVG é um formato vetorial que pode ser redimensionado sem perda de qualidade — ideal para ecrãs de alta resolução. Use SVG para maquetas de design web e PNG para compatibilidade universal.
Sim! Pode inserir qualquer largura e altura em píxeis. A ferramenta suporta qualquer dimensão de 1×1 a valores muito grandes. Para tamanhos web padrão, utilize as nossas pré-definições como Avatar, Miniatura, Banner, Social OG e templates HD.