Card Shadow CSS — Suptilni kod za sjenčanje okvira
Vizualno izradite CSS box-shadow kod: klizači za pomak, zamućenje, širenje, boju s neprozirnošću, način umetanja i do četiri sloja s pregledom uživo.
Rezultat
Ova stranica otvara unaprijed postavljen generator sjene okvira na klasičnu sjenu kartice: 2 px prema dolje, 8 px zamućenja, 15% crne neprozirnosti. Namjerno je tih — dovoljno da odvoji karticu od stranice bez najave — a pregled točno pokazuje koliko je tih.
Ovaj raspon odgovara najnižim koracima elevacije u većini sustava dizajna: kartice s popisima, padajući izbornici, skočni prozori i retci tablice pri lebdenju. Ako trebate jače podizanje za modalne ili plutajuće ploče, povećajte pomak Y i zamutite zajedno — trebali bi rasti proporcionalno kako bi izvor svjetla ostao uvjerljiv.
Kopirajte liniju sjene okvira u svoje stilove komponente ili je duplicirajte kao drugi sloj s čvršćim zamućenjem kako biste dodali definiciju rubova. Alat je besplatan i u potpunosti radi u vašem pregledniku.