Gerador de Box Shadow CSS

Ajuste os deslocamentos horizontal e vertical, o desfoque, o espalhamento, a cor e a opacidade, e ative inset se quiser que a sombra seja desenhada dentro do elemento. A pré-visualização ao vivo é atualizada na hora a cada mudança, e o CSS gerado aparece abaixo para copiar com um clique.

Não. Tudo roda inteiramente no seu navegador com JavaScript puro, então nem os ajustes, nem as cores, nem o CSS gerado são enviados a um servidor. A ferramenta funciona sem conexão depois de carregar, o que mantém o seu trabalho totalmente privado.

O desfoque suaviza as bordas da sombra (valores maiores dão bordas mais difusas), enquanto o espalhamento aumenta ou encolhe a sombra antes de aplicar o desfoque. Inset inverte a sombra para desenhá-la dentro da caixa em vez de fora, algo útil para efeitos de pressionado ou afundado.