CSS Box Shadow Generator
Készítsen CSS-doboz-árnyékkódot vizuálisan: csúszkák az eltoláshoz, elmosódáshoz, szóráshoz, színezéshez, átlátszósághoz, beillesztési módhoz és akár négy réteghez élő előnézettel.
Eredmény
A doboz-árnyék deklaráció hat mozgó részből áll – X és Y eltolás, elmosódás, szórás, szín és az opcionális beillesztési kulcsszó –, és az egyetlen módja annak, hogy ezeket helyesen lássuk. Ez a generátor minden alkatrészt egy csúszkára helyez, és az eredményt egy előnézeti kártyán jeleníti meg húzás közben, így az alján lévő CSS-sor mindig pontosan azt mutatja, amit néz.
A valós árnyékok ritkán egyrétegűek. A réteglista lehetővé teszi akár négy árnyék egymásra halmozását egy deklarációban: egy szűk sötét vonalat az élek meghatározásához, valamint egy széles lágy mosást a magassághoz, vagy a világos-sötét párost, amely meghatározza a neumorfizmust. Válasszon ki egy réteget a szerkesztéshez, távolítsa el azokat, amelyekre nincs szüksége, és a kombinált doboz-árnyékérték élőben frissül.
Az árnyékok nagyon eltérően olvashatók a sötét felületeken, ahol a fekete árnyék a majdnem fekete oldalon egyszerűen eltűnik. Az előnézeti háttér kapcsolója átkapcsolja a hátteret világos és sötét között, így mindkét témát ellenőrizheti szállítás előtt. Az előre beállított oldalak lefedik azokat a változatokat, amelyeket az emberek ténylegesen keresnek: egy lágy domborzati árnyék, egy mélyedés, a kétrétegű neumorfizmus receptje és egy finom kártyaárnyék.
Mint minden eszköz ezen az oldalon, a generátor is ingyenes, és teljes egészében az Ön böngészőjében fut: nincs feltöltés, nincs fiók, és az oldal betöltése után offline állapotban is működik.