---
title: "Como adicionar sombras a uma imagem no Markdown"
slug: "how-to-add-shadows-to-an-image-in-markdown"
description: "Markdown doesn't have a built-in way to add shadows to images, but you can use HTML tags within Markdown to achieve this effect."
tags: ["Editor", "Customization"]
updated: 2026-06-22T08:58:57Z
published: 2026-06-22T08:58:57Z
canonical: "docs.document360.com/how-to-add-shadows-to-an-image-in-markdown"
---
> ## Documentation Index
> Fetch the complete documentation index at: https://docs.document360.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Como adicionar sombras a uma imagem no Markdown
O editor Markdown não tem uma forma embutida de adicionar sombras às imagens. A solução alternativa é usar a tag HTML `<img>` com a `box-shadow` propriedade CSS dentro do `style` atributo, que o editor Markdown do Document360 renderiza corretamente.
---
## Quando usar sombras de imagem
- **Imagens em destaque ou imagens de herói** — uma sombra sutil eleva a imagem da página e dá peso visual, fazendo com que pareça menos plana contra um fundo branco.
- **Capturas de tela com fundo branco ou claro** — sem sombra, uma captura de tela com fundo claro pode se espalhar pela página. Uma sombra cria um limite visível.
- **Imagens decorativas ou de produto** — as sombras adicionam profundidade e polimento às imagens usadas para interesse visual, em vez de instrução técnica.
Use sombras com moderação. Aplicá-las a cada imagem de um artigo cria ruído visual em vez de ênfase.
NOTA
Essa técnica só funciona no **editor Markdown**. No editor WYSIWYG, use a opção de alternar sombra no painel de configurações de imagem.
---
## Entendendo a propriedade da sombra da caixa
A `box-shadow` propriedade CSS assume três valores nesta ordem:
| Valor | O que ele controla | Exemplo |
| --- | --- | --- |
| Deslocamento horizontal | Até onde a sombra se estende para a esquerda (negativa) ou para a direita (positiva) | `3px` |
| Deslocamento vertical | Até onde a sombra se estende para cima (negativo) ou para baixo (positivo) | `3px` |
| Raio de desfoque | Quão nítida ou macia a borda da sombra parece (mais alta = mais suave) | `3px` |
| Cor | A cor da sombra — qualquer nome de cor CSS ou código hexadecimal | `gray` |
---
## Referência rápida
Substitua `YOUR_IMAGE_URL`, `YOUR_ALT_TEXT`, e os valores sombra pelos seus requisitos.
```
```
Para personalizar a sombra, ajuste os três valores de pixel e o nome da cor:
```
```
NOTA
O cinza é a cor de sombra mais comumente usada porque funciona tanto contra fundos claros quanto escuros. Você pode substituir `gray` por qualquer nome de cor CSS válido ou código hexadecimal para combinar com seu design.
---
## Como adicionar uma sombra a uma imagem no Markdown
1. Abra o artigo desejado no portal da Base de Conhecimento.
2. Cole o trecho abaixo no local onde você quer que a imagem apareça.
```
```
1. Substitua `YOUR_IMAGE_URL` pela URL da sua imagem.
2. Substitua `YOUR_ALT_TEXT` por uma breve descrição da imagem para maior acessibilidade.
3. Ajuste os valores das sombras se necessário — veja a [tabela de referência de sombra de caixa](/docs/pt/how-to-add-shadows-to-an-image-in-markdown#understanding-the-box-shadow-property) acima.
---
## Desfecho
### Sem sombra
### Com sombra
## Related
- [Como adicionar acordeão no Markdown](/how-to-add-accordion-in-markdown.md)
- [Como alinhar a imagem no Markdown](/how-to-align-the-image-in-markdown.md)
- [Como alinhar o cabeçalho no centro nos artigos](/how-to-center-align-the-heading-in-the-articles.md)
- [Como mudar a cor do texto no Markdown](/how-to-change-the-color-of-the-text-in-markdown.md)