Generátor CSS Box Shadow

Bezplatný online generátor CSS box shadow s živým náhledem. Upravte odsazení, rozostření, rozptyl, barvu a průhlednost pomocí interaktivních posuvníků.

Shadow List
4px
4px
10px
0px
50%
Generated CSS

Jak to funguje

  1. Otevřete generátor a ihned uvidíte živý náhled stínu boxu.
  2. Nastavte horizontální a vertikální posun pomocí posuvníků, abyste určili polohu stínu.
  3. Upravte rozostření a rozptyl pro kontrolu měkkosti a velikosti stínu.
  4. Vyberte barvu a průhlednost stínu dle vašich designových potřeb.
  5. Zkopírujte vygenerovaný CSS kód a vložte jej přímo do svého stylopisu.

Příklad

Vstup: Horizontální: 4px, Vertikální: 8px, Rozostření: 12px, Rozptyl: 0px, Barva: #0000ff, Průhlednost: 0.4
Výsledek: box-shadow: 4px 8px 12px 0px rgba(0, 0, 255, 0.4);

Časté dotazy

Ano, CSS Box Shadow Generator je zcela zdarma a nevyžaduje žádnou registraci ani účet.

Vaše data jsou zcela v bezpečí. Veškeré zpracování probíhá pouze na straně klienta ve vašem prohlížeči. Žádná data nejsou odesílána na žádný server.

Ano, CSS umožňuje více stínů oddělených čárkou. Vygenerujte každý stín zvlášť a zkombinujte hodnoty ve svém kódu.

Ano, vlastnost box-shadow je podporována ve všech moderních prohlížečích bez potřeby prefixů.

Ano, přidejte klíčové slovo 'inset' do hodnoty box-shadow. Někteří generátory tuto možnost nabízejí přímo v nastavení.