Gerador de Box Shadow CSS
Gere visualmente propriedades CSS box-shadow com controles deslizantes. Veja uma pré-visualização em tempo real e copie o código CSS gerado.
Estúdio · ambiente neutro
Funcionalidades
Slider controls
Color picker
Inset toggle
Multiple layers
Live preview & CSS code
Como Usar
1. Modele a sombra com os controles — o cartão neutro na superfície mostra exatamente o resultado final.
2. Sombras reais têm camadas: adicione até quatro ou comece por uma predefinição (Soft, Elevated, Floating, Inner).
3. Alterne a superfície para conferir a sombra sobre branco, cinza e escuro, e copie o CSS.
Perguntas Frequentes
What is box-shadow?
The CSS box-shadow property adds shadow effects around an element's frame.
Ferramentas Relacionadas
Gerador de Gradiente CSS
Crie gradientes CSS lineares, radiais e cônicos visualmente. Adicione múltiplos ...
Gerador de Border Radius CSS
Crie CSS border-radius visualmente — controle os quatro cantos individualmente o...
Playground CSS Flexbox
Aprenda e experimente com CSS Flexbox. Ajuste as propriedades do contêiner e obs...
Gerador de CSS Grid
Crie layouts CSS Grid visualmente. Defina linhas, colunas, espaçamentos e copie ...