Ferramentas Guias
design Gratuito Sem cadastro

Gerador de QR Code

Crie valores de box-shadow CSS visualmente com prévia ao vivo — suporta múltiplas camadas.

Carregando ferramenta…

Sobre esta ferramenta

Projete sombras CSS sem adivinhar números. Ajuste deslocamentos horizontal e vertical, raio de desfoque, espalhamento, cor e o sinalizador inset de forma interativa. Empilhe múltiplas camadas de sombra para efeitos de profundidade sofisticados. Um card de prévia ao vivo mostra o resultado instantaneamente, e a declaração CSS completa está sempre pronta para copiar.

Como usar

  1. 1 Ajuste os controles deslizantes de deslocamento, desfoque e espalhamento na primeira camada.
  2. 2 Escolha uma cor de sombra e ative inset se necessário.
  3. 3 Clique em 'Adicionar Camada' para empilhar sombras adicionais para efeitos complexos.
  4. 4 Copie a declaração CSS box-shadow e cole em sua folha de estilos.

Perguntas frequentes

{# Alpine.js — self-hosted. (The previous jsdelivr CDN tag had a stale SRI integrity hash, so the browser refused to run it and window.Alpine was never defined — silently breaking every FAQ accordion and Alpine tool.) #}