Cel mai bun gratuit Generator umbra cutie CSS
Construiește vizual cutia CSS-shadow cu previzualizare live, inset și un al doilea strat - copiez codul.
100% gratuit
Nicio înscriere
Fără semn de apă
✨
Go Pro pentru cele mai bune modele de IA - imagine, video și chat - plus încărcare mai mari, prioritate în coada și nu de așteptare.
Actualizează la Pro
Iubire Best.Free? Împărtăşiţi-l.
Cum funcţionează
- Mută curentele. Setează offset, încurcă, răspândește, culoare și opacitate; comutați inset dacă doriți o umbre interioară.
- Priviți anterioarea. Cutia live se actualizează pe măsură ce trageți; adaugă un al doilea strat în Opțiuni Avansate pentru adâncime.
- Copiază CSS. Loveste Copy CSS si pega regula cutie-shadow direct in stilul de stil.
Despre acest instrument
Concepe o cutie-shadow fără a ghici valori ale pixelului. Trageți sliderurile offset-X, offset-Y, încurcate și răspândite, alegeți o culoare de umbra și marca în opacitatea sa, și uitați-vă la o cutie de previzualizare live actualizată în timp real - apoi copiați exact cutia-shadow CSS. Flip inset comuta pentru o umbra interioară. Opțiunile avansate stack un al doilea strat umbra, astfel încât puteți construi umbrele moale, multi-șare utilizate pe cărți și butonuri moderne. Totul rulează în browser-ul dumneavoastră.
Pentru ce o folosesc oamenii
- Adaugă o umbra moale la cărți și modalii
- Creați o umbra interioară (inset) pentru intrari și pușuri
- Doi straturi de stack pentru o umbra reală, difuzată
- Tună offset și neclar pentru a se potrivește cu un model de mockup
Întrebări frecvente
Offset-X/Y mișcă umbra orizontal și vertical, îndepărtează marginea, și răspândește crește sau reduce întreaga umbra înainte de a fi aplicată îndepărtarea. Previzualizarea live arată fiecare schimbare instantaneu.
Inset trage umbra în interiorul elementului în loc de în spatele ei, oferind un aspect presurat - util pentru intrarea și comutarea. Flip inset comuta pentru a schimba.
Alege o culoare, apoi folosește sliderul de opacitate; instrumentul iese o valoare rgba() astfel încât umbra se amestecă în mod natural.
Da. Deschide opțiuni avansate pentru a permite un al doilea strat de umbre cu propriul său offset, neclar, culoare și inset.
Nu. Generatorul se execută complet în browser-ul tău; slider-urile doar calculează un cord CSS local.
Complet gratuit, fără cont şi fără limită - un instrument de la client cu nimic de măsurat.
Da. Se execută în browser-ul dvs., așa că CSS Box Shadow Generator funcționează pe telefoane și tablete, precum și desktop - nu există nici o aplicație de instalat.
De obicei, doar câteva secunde pentru un fișier tipic - CSS Box Shadow Generator începe să lucreze în momentul în care i-ai dat inputul.
Utilizarea casuală este nelimitat, sub un capac generos de utilizare corectă care o menține rapid pentru toată lumea.
Toate browser-urile moderne - Chrome, Safari, Firefox și Edge. CSS Box Umbre Generator are nevoie de nimic instalat dincolo de browser-ul pe care l-ai folosit deja.