A página abre com duas camadas de sombra. Ajuste deslocamento, desfoque, expansão, cor, opacidade e sombra interna em cada camada, adicione até quatro e copie uma única declaração box-shadow.
Funciona localmente no seu navegadorA página abre com duas sombras sobre um cartão branco de prévia: 0px 18px 42px -14px rgba(31, 71, 53, 0.28) e 0px 4px 10px 0px rgba(31, 71, 53, 0.12). A prévia e o painel de saída são a mesma string: o que você vê é o que Copiar CSS coloca na área de transferência.
Cada camada mantém seu deslocamento, desfoque, expansão, cor, opacidade e opção interna. Uma camada nova é derivada da ativa em vez de começar vazia: Adicionar camada soma 4px em Y, 10px no desfoque (máximo 200) e reduz 0,06 da opacidade (mínimo 0,05), copiando expansão e cor e deixando a opção interna desmarcada.
As camadas são impressas na ordem do seletor, uma por linha, como um único valor box-shadow. A primeira linha é a sombra pintada por cima: em um teste de pixels com vermelho e 24px de expansão na camada 1 e azul com 12px na camada 2, a faixa de sobreposição de 0-12px ficou vermelha, então as camadas seguintes só aparecem onde a anterior é menor ou mais transparente.
Adicionar camada deriva a nova entrada da ativa (Y + 4px, desfoque + 10px até 200, opacidade - 0,06 até 0,05, mesma expansão e cor, sem interna). Remover camada apaga a linha ativa e mantém pelo menos uma; o contador mostra de 1 camada a 4 camadas.
Deslocamento horizontal e vertical de -100 a 100, desfoque de 0 a 200, expansão de -100 a 100 e opacidade de 0 a 1. Enquanto você digita, a prévia permanece dentro desses limites; ao sair do campo o valor arredondado é gravado de volta, de modo que campo, prévia e código sempre combinam.
Esvaziar um campo restaura o valor guardado antes em vez de virar zero. Pixels fracionários mantêm um decimal (12.5px continua 12.5px) e a opacidade mantém dois; digitar x = 999 guarda 100px e blur = -10 guarda 0px.
Cada camada aceita uma cor hex; o alfa vem do campo de opacidade, então não há hsl(), cores nomeadas, degradê nem uma segunda cor. O seletor exportado é fixo e o resultado é uma única declaração box-shadow, sem variável CSS nem saída por breakpoint.
Não existe modo drop-shadow ou text-shadow, exportação para imagem ou SVG, nem histórico além de Redefinir. Tudo é calculado na página: no teste, percorrer todos os controles, adicionar e remover uma camada, copiar e redefinir não enviou nenhuma requisição de rede, e a página continua funcionando offline.