O que é CSS Box Shadow?
A propriedade box-shadow aplica sombras ao redor de um elemento HTML. É amplamente usada em UI design para criar profundidade, realce de cards e efeitos de foco em botões.
Parâmetros da propriedade
A sintaxe completa é: box-shadow: [inset] offset-x offset-y blur-radius spread-radius color;. O offset-x e offset-y definem a posição da sombra, blur controla o desfoque e spread expande ou contrai a sombra. O prefixo -webkit-box-shadow garante compatibilidade com versões antigas de Safari e Chrome.
Como usar esta ferramenta
Ajuste os sliders para personalizar a sombra em tempo real. Use o checkbox "inset" para criar sombras internas. Controle a transparência com o slider de opacidade. Quando estiver satisfeito, clique em "Copiar" para obter o CSS pronto — já com prefixo cross-browser incluído.