1001Ferramentas
🖼️Utilitários

Imagem Placeholder

Gera imagens placeholder em PNG nas dimensões e cores escolhidas, com texto centralizado. Útil para protótipos.

Baixar PNG

Para que serve?

A ferramenta monta um PNG com texto centralizado, usando as dimensões e cores que você definir. Serve para tapar buracos de layout enquanto o design ainda está em rascunho, sem ter que recorrer a serviços de fora como o placeholder.com.

Quem desenha a imagem é o Canvas, dentro do próprio navegador. No fim você recebe uma Data URL: dá para visualizar ali mesmo e baixar.

Nada sai do seu navegador. A geração acontece toda localmente.

Gere imagens placeholder

No meio do desenvolvimento de um site ou app, sempre falta uma imagem de espaço reservado antes das definitivas chegarem. Esta ferramenta gera imagens placeholder em PNG no tamanho exato que você pedir, com cor de fundo e um texto centralizado.

Você escolhe largura, altura e cores, e a imagem sai com as medidas escritas no centro, aquele retângulo cinza com "600×400" ou a medida que você pedir, marcando onde vai entrar o conteúdo real. Boa para montar mockups, testar layouts responsivos e ver como um design se comporta enquanto as imagens finais não vêm.

A imagem nasce inteira no navegador, pronta para baixar e usar. Você não depende de serviço externo de placeholder e não manda nada para fora.

Perguntas frequentes

Qual o tamanho e o formato padrão da imagem gerada?
A página abre já com uma imagem pronta de 600 por 400 pixels, fundo cinza claro e texto cinza escuro, e redesenha a cada tecla digitada em qualquer campo. Deixando a caixa de texto vazia, o desenho traz as próprias dimensões, no formato largura por altura com o sinal de multiplicação. A saída é sempre PNG, baixada com nome fixo; não há opção de JPEG, WebP ou SVG, nem uma URL no estilo dos serviços de placeholder que aceitam o tamanho no caminho do endereço.
Existe limite de largura e altura?
Os campos anunciam um mínimo de 1 e um máximo de 4000 pixels, mas esse teto é só um atributo do formulário: o código não corta o valor digitado, então nada impede de pedir 12000 por 12000. Passando da área máxima de canvas que o navegador aceita, o desenho falha e o download sai como arquivo vazio ou corrompido, sem aviso. Campo vazio ou zero cai no padrão de 600 e 400. Vale ficar dentro do teto anunciado quando a imagem precisa mesmo ser usada.
Por que o meu texto estourou as bordas da imagem?
Porque o texto é desenhado em uma única linha, centralizado, com a fonte fixada em 15 por cento do menor lado da imagem — não existe quebra de linha automática nem redução para caber. Frase longa em imagem estreita, ou uma faixa bem baixa como 800 por 50, transborda pelas laterais e sai cortada. As saídas são espremer o texto, aumentar a altura ou pedir dimensões mais quadradas. Também não há controle de fonte, peso, alinhamento ou posição: é sempre negrito sem serifa, no centro exato.

Ferramentas Relacionadas