Pockit

🚀 Pockit chegou ao Chrome!

Pare de pesquisar no Google. Acesse as ferramentas com um clique.

Usar no Chrome (Grátis)

Privacidade Totalmente Garantida

Seus arquivos são processados diretamente no navegador e nunca saem do seu dispositivo.

Gerador de Sombra de Caixa

Sombras perfeitas. Crie efeitos de `box-shadow` CSS visualmente e copie o código otimizado. Adicione profundidade e estilo.

Presets

0px
10px
20px
0px
0.30

Pré-visualização

Código CSS

box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.3);

Dica: Ajuste os controles deslizantes para ver o efeito de sombra mudar em tempo real!

Gerador de Sombra de Caixa CSS

Projete visualmente sombras de caixa CSS usando controles deslizantes. Pré-visualize o efeito em um elemento de cartão e copie o código CSS gerado instantaneamente.

1Quando usar esta ferramenta?

💡Adicionar profundidade a botões ou UIs de cartões
💡Experimentar com efeitos de sombra suave
💡Quando escrever código CSS manualmente é entediante

2Funcionalidades

  • Controles deslizantes interativos para todas as propriedades
  • Pré-visualização em tempo real
  • Suporte para sombras internas
  • Copia CSS em um clique

3Como usar

  • Ajuste os deslocamentos X e Y, desfoque e raio de propagação.
  • Mude a cor da sombra e a opacidade.
  • Alterne 'Interna' para sombras internas.
  • Copie o código CSS para seu projeto.

Perguntas Frequentes

Q. O que é o raio de propagação?

A. O raio de propagação aumenta ou diminui o tamanho da sombra. Valores positivos a tornam maior, valores negativos a tornam menor.

Ferramentas Recomendadas

Experimentar agora

CSS Flexbox
Domine o layout responsivo. Experimente com Flexbox visualmente e gere o código perfeito. Aprenda e construa interfaces mais rápido.
Try it
Gerador de Animações CSS
Crie animações CSS sem código. Escolha presets como fade, slide, bounce ou spin—ajuste velocidade e easing, e copie o código @keyframes pronto pra usar.
Try it
Conversor HTML para Markdown
Converta HTML para Markdown limpo instantaneamente. Extraia conteúdo de páginas web, blogs e documentos. Estilos de título, blocos de código e formatos de lista personalizáveis. 100% processamento no navegador.
Try it