Crie belas sombras de caixa CSS sem esforço
Gere sombras de caixa impressionantes com nossa interface intuitiva. Copie o código CSS e use-o em seus projetos instantaneamente.
Preview
Sombra da caixa
Personalize-me
Saída CSS
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
Controles de sombra
Position
0px
4px
Size
6px
-1px
Color
10%
Options
Presets
Sombra Suave
Sombra média
Sombra Pesada
Sombra Interior
Diagonal afiada
Brilho de contorno
Sombra dupla
Efeito Levantado
Modo de Utilização
Controles básicos
- Ajuste oDeslocamento horizontalPara mover a sombra para a esquerda ou para a direita
- Ajuste oDeslocamento verticalpara mover a sombra para cima ou para baixo
- Aumente oRaio de desfoquepara tornar a sombra mais suave
- Use Raio de propagaçãopara aumentar ou diminuir o tamanho geral da sombra
- Altere oColor and OpacityPara personalizar a aparência da sombra
Recursos avançados
- Enable Sombra inseridaPara criar um efeito de sombra interna
- Use Múltiplas Sombraspara efeitos mais complexos
- Salvar e carregarPresetspara acesso rápido às suas sombras favoritas
- Click Sombra aleatóriapara inspiração
- Copie o código CSS gerado e cole-o em seu projeto
Related Tools
Gerador de transição CSS3
Transição suave de opacidade
Conversor SCSS para CSS
Transforme seu código SCSS em CSS. Rápido, fácil e seguro.
Crie um belo gradiente de texto CSS sem esforço
Crie efeitos de texto gradiente impressionantes para o seu site
Conversor de unidade de peso
Converta entre diferentes unidades de peso com precisão para suas necessidades culinárias, físicas e científicas
Calculadora de hash SHA-256
Gere hashes SHA-256 de forma rápida e fácil
Calculadora de intervalo de confiança
Calcule intervalos de confiança para seus dados de amostra com precisão e facilidade.