Aby animować nasz SVG, musimy dostosować następujące części SVG w naszym CSS – klasę „.st0” i znacznik <path></path>.
Kopiuj i wklej następujący kod do swojego pliku CSS.
Możemy ustawić kolory obrysu i wypełnienia naszego SVG w klasie „.st0” i znaczniku <path></path>. Tutaj ustawiliśmy je na czarny #000. Zauważ, że zaczęliśmy od białego obrysu #FFF i bez koloru wypełnienia. w Adobe Illustrator. Jest to ważne dla wszystkich właściwości SVG, mogą one być zmienione w naszym pliku .css.
Taki jest wynik
Możesz absolutnie dostosować animację do swoich potrzeb. Zauważ, że powyżej użyliśmy animacji typu cubic-bezier. Tutaj jest dobre miejsce na dostosowanie animacji https://cubic-bezier.com/
Znajdź pełny kod naszej strony internetowej poniżej
HTML
CSS
Pobierz Adobe Illustrator stąd https://www.adobe.com/products/illustrator.html
To jest to moi przyjaciele, jeśli podobał Ci się ten artykuł odwiedź naszą stronę na Facebooku i naszą stronę IRIS WEB CORE.
I jak zawsze miłego dnia!