Daily Toolkits

Gerador de sombra de caixa

Projete sombras de caixa em camadas com deslocamento, desfoque, propagação e cor. Visualize em um cartão e copie o CSS com um clique.

Box Shadow Generator

Live
Preview card

CSS output

box-shadow: 8px 16px 32px -4px rgba(192, 38, 211, 0.35);
border-radius: 24px;

Key capabilities

  • Projete sombras de caixa em camadas com deslocamento, desfoque, propagação e cor - visualização ao vivo incluída.
  • Executa no seu navegador
  • Grátis para usar

Como usar

  1. Ajuste o deslocamento, o desfoque e a propagação.
  2. Escolha a cor e a opacidade (ou adicione camadas).
  3. Copie o CSS da sombra da caixa.

How this tool works

  1. Ajuste o deslocamento, o desfoque e a propagação.
  2. Escolha a cor e a opacidade (ou adicione camadas).
  3. Copie o CSS da sombra da caixa.

Recommended settings

  • Use as opções padrão primeiro e depois ajuste se necessário

Supported formats

Text / on-page input

File size and limits

  • Visualizações multicamadas muito complexas podem parecer mais lentas em telefones mais antigos.

Privacy

Os geradores de cores e CSS são executados inteiramente no seu navegador. Pré-visualizações e conversões nunca carregam seus estilos.

Common use cases

  • Use o Box Shadow Generator sempre que precisar: Projete sombras de caixa em camadas com deslocamento, desfoque, propagação e cor - visualização ao vivo incluída.

Troubleshooting

A visualização parece diferente depois de colar

Verifique se há CSS concorrentes em sua página (redefinições, cores herdadas). Copie primeiro a regra gerada em uma folha de estilo isolada.

Perguntas frequentes

Isso carrega meu CSS?

Não. Geradores e conversores são executados em seu navegador com visualização ao vivo.

Eu preciso de uma conta?

Não. Abra a ferramenta, ajuste os controles e copie o CSS.

Ferramentas relacionadas

Text Shadow Generator

Craft readable text-shadow styles with live typography preview.

Open tool

Border Radius Generator

Control each corner independently and preview rounded shapes with copy-ready CSS.

Open tool

CSS Gradient Generator

Build linear, radial, and conic gradients with live preview and copy-ready CSS.

Open tool