Gerador de sombra de caixa CSS

O que isso faz

Construa elevações realistas em vez de adivinhar valores. Ajuste o deslocamento horizontal e vertical, desfoque, propagação, cor e opacidade, empilhe várias camadas para obter profundidade e copie a regra CSS exata.

Projete visualmente sombras de caixa em camadas e copie CSS pronto para produção.

Como usar

Aqui está a versão resumida do uso de Gerador de sombra de caixa CSS.

• Defina os deslocamentos e desfoque — Arraste os controles deslizantes ou digite os valores exatos dos pixels; o cartão de visualização é atualizado imediatamente.
• Escolha a cor e a opacidade — Use o seletor de cores e o controle deslizante alfa para combinar com sua paleta, incluindo sombras no modo escuro.
• Copie o CSS — Adicione mais camadas se precisar de uma sombra mais suave e natural e copie a declaração box-shadow.

Recursos que importam

O que Gerador de sombra de caixa CSS faz bem.

• Nada sai do seu dispositivo — O trabalho acontece na aba do seu navegador. Não há ponto de extremidade de upload neste aplicativo, portanto, seus arquivos e texto não podem ser armazenados, registrados ou vistos por nós.
• Sem upload, aguarde — Você pula totalmente a viagem de ida e volta para um servidor. Os resultados são limitados pela sua própria CPU, não pela velocidade da rede ou pelo tamanho da fila.
• Gratuito, sem conta, sem cotas — Sem parede de inscrição, sem marca d'água, sem limite diário. Existem contas opcionais apenas para salvar favoritos e predefinições em dispositivos.