Ir para o conteúdo
Totalmente local

Gerador de imagens de marcador de posição

Gere uma imagem SVG de marcador de posição com tamanho, cores e etiqueta personalizados — como SVG, data: URI ou uma tag <img>.

0
Saída

Gerador de imagens de marcador de posição

Escolha uma largura e altura — ou uma proporção comum como 16:9 ou 4:3 — e esta ferramenta desenha uma imagem de marcador de posição no local, pronta para ser colocada numa composição, num esquema ou num local da sua marcação onde o ativo real ainda não está pronto. Apresenta-se como SVG, para que a caixa permaneça nítida em qualquer tamanho e escale sem um raster desfocado por baixo.

Defina uma cor de fundo e de texto, e deixe que a etiqueta não predefinida mostre as dimensões apresentadas (como "800×600") ou escreva a sua própria legenda — um nome de componente, um ponto de quebra, qualquer coisa que o ajude a distinguir um marcador de posição de outro enquanto constrói. A família de fontes e o tamanho também são ajustáveis, e arredondar os cantos ou sobrepor uma grelha ou uma cruz diagonal dão à caixa o aspecto familiar "isto é um marcador de posição" em vez de um simples rectângulo cinzento.

Escolha como o resultado aparece: marcação SVG bruta para guardar como ficheiro, uma data: URI codificada em percentagem ou uma em base64 para um fundo CSS ou uma fonte de imagem integrada, ou uma tag img completa que pode colar directamente em HTML. Dimensões muito grandes ou uma etiqueta desrazoavelmente longa são limitadas em vez de permitidas para congelar o separador ou produzir algo que ninguém pudesse utilizar.

Tudo é desenhado localmente no seu navegador no momento em que muda uma opção — nenhuma imagem é gerada num servidor e nada do que escreve é carregado em qualquer lugar. Copie o resultado, descarregue-o como ficheiro .txt, ou envie-o directamente para outra ferramenta, como o codificador de URL SVG ou o conversor de cores.

FAQ

A imagem é actualizada quando mudo as opções?
Sim. A pré-visualização regenera-se em tempo real enquanto ajusta a largura, altura, cores, a etiqueta ou qualquer outra opção.
Posso usar a saída directamente como uma fonte de imagem?
Sim. Escolha o formato data: URI ou base64 e cole o resultado directamente numa tag <img src="..."> ou num background-image CSS.
O que acontece se eu definir uma proporção de aspecto e uma altura ao mesmo tempo?
A proporção de aspecto ganha: a altura é recalculada a partir da largura para que a imagem mantenha exactamente essa proporção.
Existe um limite de tamanho?
A largura e altura são limitadas a 4000px cada uma, e uma etiqueta personalizada extremamente longa é rejeitada com uma mensagem pedindo-lhe que a encurte, para que a ferramenta nunca tente construir uma imagem inutilizavelmente grande.
Os meus dados são carregados em algum lugar?
Não. A imagem de marcador de posição é gerada inteiramente no seu navegador — nada é enviado para um servidor.