Card Shadow CSS — Subtilní box-shadow Code
Vizuálně vytvořte kód CSS box-shadow: posuvníky pro posun, rozostření, roztažení, barvu s neprůhledností, režim vložení a až čtyři vrstvy s živým náhledem.
Výsledek
Tato stránka otevře přednastavený generátor box-shadow na klasický stín karty: 2px dolů, 8px rozostření, 15% krytí černé. Je záměrně tichý – dost na to, aby oddělil kartu od stránky, aniž by se ohlásil – a náhled přesně ukazuje, jak tichý je.
Tento rozsah odpovídá nejnižším výškovým krokům ve většině návrhových systémů: seznamové karty, rozevírací nabídky, vyskakovací okna a řádky tabulek při umístění kurzoru myši. Pokud potřebujete silnější zdvih pro modální nebo plovoucí panely, zvedněte odsazení Y a rozostřte společně – měly by růst úměrně, aby byl zdroj světla věrohodný.
Zkopírujte čáru stínu rámečku do stylů komponent nebo ji duplikujte jako druhou vrstvu s užším rozmazáním, abyste přidali definici hran. Nástroj je zdarma a běží výhradně ve vašem prohlížeči.