SaintJSONFerramentas sagradas para devs
Ferramenta sagrada

Gerador de Box Shadow Online Grátis

Crie sombras CSS box-shadow no painel com sliders de X, Y, blur, spread e opacidade. Preview em tempo real com código CSS e classe Tailwind prontos. 100% client-side.

Deslocamento em X0px
Deslocamento em Y10px
Desfoque (Blur)25px
Propagação (Spread)0px
Opacidade25%

A Profileza resplandece

0px 10px 25px 0px @ 25%

As Escrituras da Sombra

box-shadow: 0px 10px 25px 0px rgba(0, 0, 0, 0.25);

shadow-[0px_10px_25px_0px_rgba(0,0,0,0.25)]

No Tailwind, a classe arbitrária usa _ no lugar dos espaços — os escombros da heresia CSS purificados em um único token.

Box Shadow: A Sombra do Cartão Profano

Uma sombra bem calibrada dá profundidade a qualquer interface. Arraste os cinco controles — deslocamento X e Y, desfoque, propagação e opacidade — e veja o cartão ganhar gradiente de vida sobre o vácuo.

Como funciona

1. Ajuste X, Y, blur, spread e opacidade com os sliders.

2. O preview reza a sombra em tempo real, com o texto mostrando os números da profecia.

3. Copie o CSS puro ou a classe arbitrária do Tailwind.

Quando usar

Elevar cards, dar profundidade a modais e mobile menu, criar estados de hover e qualquer ocasião em que um elemento precise pairar sobre o resto do design.

Perguntas frequentes