Softonic

Gerador de Imagem Markdown

Etapa 1 / 3
Próximo

A sintaxe de imagem do Markdown, ![alt](src "title"), é fácil de errar: escapa um colchete, esquece o texto alternativo ou a confunde com a sintaxe de link e seu documento acaba mostrando um marcador quebrado. Este gerador recebe a URL da imagem, o texto alternativo, um título opcional e um destino de link opcional e produz tanto o Markdown inline quanto o de estilo de referência, para você colar aquele que se encaixa no seu documento.

Como gerar a sintaxe de imagem do Markdown

  1. 1

    Cole a URL da imagem

    URL absoluta (https://...) ou caminho relativo (/images/hero.png).

  2. 2

    Escreva o texto alternativo

    O que a imagem mostra, em uma frase. Essencial para a acessibilidade.

  3. 3

    Adicione um título (opcional)

    Exibido ao passar o mouse na maioria dos renderizadores.

  4. 4

    Envolva em um link (opcional)

    Informe uma URL para tornar a imagem clicável.

  5. 5

    Copie o trecho

    Obtenha a saída inline `![alt](src)` ou o estilo de referência `![alt][ref]`.

As quatro variantes de sintaxe

Inline, sem título:

![Imagem principal do produto](/images/hero.png)

Inline, com título:

![Imagem principal](/images/hero.png "Imagem principal tirada em outubro de 2026")

Imagem clicável (imagem envolvida em um link):

[![Imagem principal](/images/hero.png)](https://example.com/buy)

Estilo de referência (mantém URLs longas fora do parágrafo):

![Imagem principal][hero]

[hero]: /images/hero.png "Imagem principal tirada em outubro de 2026"

O texto alternativo importa

  • Acessibilidade. Os leitores de tela anunciam o texto alternativo; um alt vazio deixa a imagem praticamente invisível para uma pessoa com deficiência visual.
  • SEO. Os mecanismos de busca usam o texto alternativo para entender o conteúdo da imagem. A falta de alt prejudica o tráfego vindo da busca de imagens.
  • Degradação elegante. Se a imagem não carrega, o texto alternativo é o que os usuários veem.

Texto alternativo bom e ruim

Intenção Bom texto alternativo Texto alternativo ruim
Foto de produto “Caneca de cerâmica vermelha sobre uma mesa de madeira, alça à esquerda” “Imagem de uma caneca”
Captura de tela “Página de login com e-mail, senha e botões de SSO” “screenshot.png”
Decorativo "" (alt vazio para pura decoração) “imagem decorativa”
Infográfico “Gráfico de barras: a receita cresceu de R$ 1 milhão em 2023 para R$ 3 milhões em 2026” “gráfico de barras”

Armadilhas

  • Não comece o alt com “Imagem de”, os leitores de tela já o anunciam como uma imagem.
  • Caminhos absolutos x relativos. Caminhos relativos quebram quando o documento é renderizado fora da sua pasta (por exemplo, na pré-visualização do GitHub). Na dúvida, use caminhos absolutos.
  • Espaços nas URLs exigem codificação: %20 no lugar de um espaço, ou a imagem não carrega.

Perguntas frequentes

Não em Markdown puro. A maioria dos renderizadores (GFM, Docusaurus, MkDocs) recorre ao HTML bruto para o dimensionamento, <img src="..." width="400" alt="...">. Alguns dialetos aceitam ![alt](url =400x), mas não é universal.

O alt é o texto anunciado aos leitores de tela e exibido se a imagem falhar. O título é a dica que aparece ao passar o mouse: geralmente opcional e ignorado em dispositivos de toque.

Quando a imagem aparece várias vezes ou quando a URL é longa e sobrecarrega o parágrafo. O estilo de referência mantém o texto legível e reduz a troca de URL a uma única edição.

Sim, aninhar uma imagem dentro de um link ([![alt](img)](url)) é CommonMark padrão. A saída renderizada é um hyperlink que envolve um <img>.

Ferramentas relacionadas

Referência da Tabela ASCII

Tabela ASCII completa de 0 a 127 com valores decimais, hexadecimais, octais e binários e notação de referência numérica HTML, incluindo NUL, LF e DEL.

Referência de Caracteres HTML

Lista pesquisável de entidades HTML, seus códigos nomeados e numéricos, e uma cópia com um clique para caracteres e símbolos especiais.

Referência de atalhos de teclado

Pesquise atalhos padrão documentados do VS Code, Chrome e Bash com GNU Readline no macOS, Windows e Linux.

Gerador de EditorConfig

Gere um arquivo .editorconfig com suas regras de estilo e tamanho de indentação, fim de linha, charset e espaços em branco para formatação consistente entre IDEs e editores.

Validador de Email

Valide um endereço de email: verificação de sintaxe RFC 5322, consulta de registro MX em tempo real, além de detalhes de parte local, domínio e comprimento. Nenhum email é enviado.

Conversor de Tamanho de Arquivo

Converta entre bytes, KB, MB, GB, TB e as unidades binárias IEC (KiB, MiB, GiB, TiB), combinando decimal e binário como preferir.

Ferramenta disponível em outros idiomas