Gerador de Sombra de Caixa CSS
Crie sombras de caixa visualmente.
Como usar
Comece de uma predefinição ou de uma camada, depois adicione camadas para profundidade. Ative o efeito interno para efeitos pressionados/neumórficos. Copie o valor separado por vírgulas para box-shadow.
Perguntas frequentes
Posso empilhar várias sombras?
Sim — adicione camadas para combinar uma sombra ambiente suave com uma sombra de contato bem definida ou empilhar brilhos coloridos. Cada camada tem seu próprio deslocamento, desfoque, expansão, cor e seletor inset.
O que as predefinições fazem?
Pontos de partida em um clique: elevação de cartão no estilo Stripe, neumorfismo elevado ou pressionado, profundidade Material e brilho suave — ajuste os controles deslizantes depois de aplicar.
Como uso a saída?
Copie a linha box-shadow para o seu CSS. Várias camadas são separadas por vírgulas, exatamente como os navegadores esperam.
Última atualização: