RevealTheme logo

Gerador de Box Shadow CSS

Crie valores de box-shadow em CSS de forma visual. Visualize em tempo real e copie o CSS gerado.

box-shadow: 0px 8px 16px 0px #00000033;

O que é o Gerador de Box Shadow CSS?

A propriedade box-shadow do CSS aceita deslocamento horizontal, deslocamento vertical, raio de desfoque, raio de expansão e cor. É possível empilhar várias sombras para efeitos em camadas. Este gerador visual produz o CSS para qualquer combinação: útil para botões, cards e efeitos de profundidade.

Perguntas frequentes

Como empilho várias sombras?
Separe-as com vírgulas no valor de box-shadow. Empilhá-las cria uma profundidade mais realista que uma única sombra.
Qual é a diferença entre desfoque e expansão?
O desfoque (blur) suaviza as bordas da sombra; a expansão (spread) amplia ou reduz o tamanho da sombra antes de desfocá-la.

Ferramentas relacionadas