Interactive box-shadow builder with multi-layering, real-time Canvas preview, and CSS output.
As sombras da caixa adicionam profundidade aos elementos da IU, simulando iluminação e elevação. Sombras bem projetadas criam hierarquia visual e tornam as interfaces mais táteis.
Ajuste o deslocamento horizontal, deslocamento vertical, desfoque, propagação, cor e opacidade. A visualização do Canvas é atualizada em tempo real. Copie o código CSS quando estiver satisfeito.
Qual é a diferença entre desfoque e propagação? O desfoque controla o quão suave é a borda da sombra. Spread controla o quanto a sombra se expande.
Quantas camadas de sombra devo usar? 1-2 camadas geralmente são suficientes. Use sombras inseridas para profundidade interna.