Box Shadow Generator

Proiectați umbre cutie stratificate cu offset, estompare, răspândire și culoare. Previzualizează pe un card, apoi copiază CSS-ul cu un singur clic.

Box Shadow Generator

Live
Preview card

CSS output

box-shadow: 8px 16px 32px -4px rgba(192, 38, 211, 0.35);
border-radius: 24px;

Key capabilities

  • Proiectați umbre cutie stratificate cu offset, estompare, răspândire și culoare - previzualizare live inclusă.
  • Se rulează în browserul dvs
  • Gratuit de utilizat

Cum se folosește

  1. Ajustați offset, estompare și răspândire.
  2. Alegeți culoarea și opacitatea (sau adăugați straturi).
  3. Copiați CSS-ul box-shadow.

How this tool works

  1. Ajustați offset, estompare și răspândire.
  2. Alegeți culoarea și opacitatea (sau adăugați straturi).
  3. Copiați CSS-ul box-shadow.

Recommended settings

  • Utilizați mai întâi opțiunile implicite, apoi ajustați dacă este necesar

Supported formats

Text / on-page input

File size and limits

  • Previzualizările cu mai multe straturi foarte complexe se pot simți mai lente pe telefoanele mai vechi.

Privacy

Generatoarele de culoare și CSS rulează în întregime în browserul dvs. Previzualizările și conversiile nu vă încarcă niciodată stilurile.

Common use cases

  • Folosiți Box Shadow Generator ori de câte ori aveți nevoie: proiectați umbre stratificate cu offset, estompare, răspândire și culoare - previzualizare live inclusă.

Troubleshooting

Previzualizarea arată diferit după lipire

Verificați dacă există CSS concurente pe pagina dvs. (resetări, culori moștenite). Copiați mai întâi regula generată într-o foaie de stil izolată.

Întrebări frecvente

Acest lucru îmi încarcă CSS-ul?

Nu. Generatoarele și convertoarele rulează în browserul dvs. cu previzualizare live.

Am nevoie de un cont?

Nu. Deschideți instrumentul, modificați controalele și copiați CSS-ul.

Instrumente similare