Per animare il nostro SVG ci preoccupiamo di regolare le seguenti parti dell’SVG nel nostro CSS – la classe “.st0” e il tag <path></path>.
Copia e incolla il seguente codice nel tuo file CSS.
Possiamo impostare i colori del tratto e del riempimento del nostro SVG nella classe “.st0” e nel tag <path></path>. Qui li abbiamo impostati su nero #000. Notate che abbiamo iniziato con un tratto bianco #FFF e nessun colore di riempimento. in Adobe Illustrator. Questo è valido per tutte le proprietà dell’SVG, possono essere cambiate nel nostro file .css.
Questo è il risultato
È assolutamente possibile personalizzare l’animazione. Notate che abbiamo usato un’animazione cubico-bezier qui sopra. Ecco un buon posto per personalizzare la tua animazione https://cubic-bezier.com/
Trova il codice completo per la nostra pagina web qui sotto
HTML
CSS
Prendi Adobe Illustrator da qui https://www.adobe.com/products/illustrator.html
Questo è tutto amici miei, se ti è piaciuto questo articolo visita la nostra pagina Facebook e il nostro sito IRIS WEB CORE.
E come sempre buona giornata!