Gerador CSS de sombras coloridas
Mostra uma sombra de caixa CSS e copia o código.
Gerador CSS de sombras coloridas
Your result appears here
Adjust the values to see your result automatically.
Como usar Gerador CSS de sombras coloridas
Color CSS shadow generator builds a box-shadow declaration from horizontal and vertical offsets, blur, spread, a shadow color and an opacity from 0 to 1, with an optional inset shadow. It shows a live preview card and outputs a ready-to-copy CSS line that writes the color as rgba.
- Ajuste os valores; um resultado inicial é calculado a partir dos padrões.
- Altere as configurações básicas ou abra o modo avançado para refinar o resultado.
- Revise e copie ou baixe seu resultado. Pause os resultados ao vivo para executar manualmente. Fontes ou configurações individuais acima de 20,000 caracteres exigem uma execução explícita.
O que esta ferramenta suporta
Mostra uma sombra de caixa CSS e copia o código.
- Deslocamento horizontal (px)
- Set this value for your task.
- Deslocamento vertical (px)
- Set this value for your task.
- Desfoque (px)
- Range: 0 to 200
- Extensão (px)
- Set this value for your task.
- Cor da sombra
- Set this value for your task.
- Opacidade
- Range: 0 to 1
- Interna
- Set this value for your task.
Limites e processamento
Use números finitos, datas válidas e os intervalos mostrados por cada controle. Valores inválidos produzem um erro sem resultado baixável.
Fonte de exemplo
Hello ToolCabana
Perguntas frequentes
How do I make an inset box shadow in CSS?
Turn on the Inset option. The generated declaration then starts with the inset keyword, and the preview card shows the shadow inside its edges instead of outside.
How do I set the transparency of a CSS shadow?
Use the Opacity slider, from 0 to 1 in steps of 0.01. The chosen color is converted to rgba with that alpha value, so the default of 0.15 gives a soft shadow.
What is the maximum blur for the shadow generator?
Blur accepts whole pixel values from 0 to 200. The horizontal and vertical offsets and spread can be negative, which moves or shrinks the shadow.
Onde minha entrada é processada?
Esta operação processa sua fonte no seu navegador. Copiar e baixar são ações explícitas; a entrada de origem não é salva em conta nem em histórico.
Quais são os limites de entrada?
Use números finitos, datas válidas e os intervalos mostrados por cada controle. Valores inválidos produzem um erro sem resultado baixável.