Pentru a anima SVG-ul nostru suntem preocupați de ajustarea următoarelor părți ale SVG-ului în CSS-ul nostru – clasa „.st0” și tag-ul <path></path>.
Copiați și lipiți următorul cod în fișierul dvs. CSS.
Puteți seta culorile de trasare și umplere ale SVG-ului nostru în clasa „.st0” și în tag-ul <path></path>. Le-am setat aici la negru #000. Observați că am început cu o linie albă #FFF și fără culoare de umplere. în Adobe Illustrator. Acest lucru este valabil pentru toate proprietățile SVG-ului, ele pot fi modificate în fișierul nostru .css.
Acesta este rezultatul


Puteți personaliza absolut orice animație. Observați că am folosit o animație cubic-bezier mai sus. Aici este un loc bun pentru a personaliza animația https://cubic-bezier.com/
Căutați codul complet al paginii noastre web mai jos
HTML
CSS
Obțineți Adobe Illustrator de aici https://www.adobe.com/products/illustrator.html
Asta e tot prietenii mei, dacă v-a plăcut acest articol vizitați pagina noastră de Facebook și site-ul nostru IRIS WEB CORE.
Și ca întotdeauna să aveți o zi minunată!