Pro animaci našeho SVG se zabýváme úpravou následujících částí SVG v našem CSS – třídy „.st0“ a značky <path></path>.
Zkopírujte a vložte do svého souboru CSS následující kód:
Ve třídě „.st0“ a značce <path></path> můžeme nastavit barvy tahu a výplně našeho SVG. Zde jsme je nastavili na černou barvu #000. Všimněte si, že jsme začali s bílým tahem #FFF a bez barvy výplně. v aplikaci Adobe Illustrator. To platí pro všechny vlastnosti SVG, lze je změnit v našem souboru .css.
Toto je výsledek
Animaci si můžete absolutně přizpůsobit. Všimněte si, že jsme výše použili animaci ve tvaru krychle-bezier. Zde je dobré si animaci přizpůsobit https://cubic-bezier.com/
Níže najdete celý kód naší webové stránky
HTML
CSS
Zde si můžete stáhnout Adobe Illustrator https://www.adobe.com/products/illustrator.html
To je vše přátelé, pokud se vám tento článek líbil, navštivte naši stránku na Facebooku a náš web IRIS WEB CORE.
A jako vždy přeji krásný den!