0

Generator CSS box-shadow

Vizualno ustvarite kodo CSS za box-shadow: drsniki za zamik, zameglitev, razmik, barvo s prosojnostjo, način inset in do štiri plasti s predogledom v živo.

🔒 V celoti obdelano v vašem brskalniku – nič, kar tukaj vnesete, ni nikoli naloženo.

0px
4px
12px
0px
0.25
Obdelava ... 0%

Rezultat

Deklaracija box-shadow ima šest gibljivih delov — zamik X in Y, zameglitev, razmik, barvo in neobvezno ključno besedo inset — edini način, da jih pravilno nastavite, je, da jih vidite. Ta generator vsak del postavi na drsnik in med vlečenjem prikaže rezultat na predogledni kartici, tako da vrstica CSS na dnu vedno natančno ustreza temu, kar vidite.

Sence v resničnem svetu so redko ena plast. Seznam plasti vam omogoča, da v eni deklaraciji zložite do štiri sence: ozko temno črto za definicijo robov in širok mehak preliv za višino ali svetlo-temen par, ki opredeljuje neumorfizem. Izberite plast, da jo uredite, odstranite tiste, ki jih ne potrebujete, in združena vrednost box-shadow se posodablja v živo.

Sence so na temnih vmesnikih videti zelo drugače, kjer črna senca na skoraj črni strani preprosto izgine. Preklop ozadja predogleda preklaplja podlago med svetlo in temno, tako da lahko pred objavo preverite obe temi. Strani s prednastavitvami pokrivajo različice, ki jih ljudje dejansko iščejo: mehka senca za višino, notranje ugreznjeno polje, dvoslojni neumorfni recept in subtilna kartična senca.

Kot vsako orodje na tem spletnem mestu je tudi ta generator brezplačen in v celoti deluje v vašem brskalniku: brez nalaganja, brez računa in deluje tudi brez povezave, ko se stran naloži.