Sim. O CSS permite quantas camadas quiser separadas por vírgula. Cada camada tem seus próprios parâmetros de offset, blur, spread e cor, o que permite efeitos muito mais ricos do que uma única sombra.
Carregando ferramenta… / Loading tool…
Monte sombras multicamada, ajuste blur, spread, cor e opacidade, copie o CSS pronto.
A propriedade `box-shadow` aceita uma lista de sombras separadas por vírgula, cada uma com os parâmetros: offset horizontal, offset vertical, raio de desfoque (blur), raio de spread e cor. Quando inset é ativado, a sombra aparece dentro do elemento em vez de fora. A ordem das camadas na lista importa: a primeira fica sobre as demais. Designs sofisticados costumam usar de três a quatro camadas com opacidades baixas para imitar como a luz real se comporta em superfícies físicas. A cor da sombra também não precisa ser preta pura, usar versões escuras da cor de fundo reduz o aspecto artificial e deixa o resultado mais natural.
Cole o código no seu HTML e a ferramenta aparece na sua página, sem a navegação e sem os anúncios do J-Kit. Ela continua rodando no navegador de quem visita o seu site.
<iframe
src="https://jkit.tools/embed/pt-BR/gerador-sombra-css"
width="100%"
height="600"
style="border:0"
loading="lazy"
title="Gerador de Sombra CSS"
></iframe>Estas referências ajudam a contextualizar fórmulas, padrões, APIs e limitações usadas nesta página. Elas não substituem validação profissional quando o resultado tiver impacto jurídico, financeiro, médico ou operacional.
Sim. O CSS permite quantas camadas quiser separadas por vírgula. Cada camada tem seus próprios parâmetros de offset, blur, spread e cor, o que permite efeitos muito mais ricos do que uma única sombra.
box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.25);O CSS é gerado localmente no navegador.