Guide e articoli

SVG vs PNG: Quale Formato Usare?

Usa SVG per icone di siti web, loghi e interfacce perché i tracciati vettoriali restano nitidi su ogni schermo. Usa PNG quando ti serve un immagine a pixel fissi per email o social network.

Come Animare Icone SVG con CSS

Aggiungi una classe CSS al tag SVG inline e usa keyframes con transform o stroke-dasharray. Il nostro editor genera animazioni fluide a 60fps senza JavaScript.

Come Modificare Icone SVG in Figma o nel Browser

Copia il codice SVG da SVG Nexus e incollalo direttamente in Figma o Illustrator per modificare i nodi vettoriali, oppure apri l icona nel nostro Studio Vettoriale.

Come Usare Icone SVG in React, Next.js e Vue

Seleziona la scheda React TSX o Vue 3 in qualsiasi pagina icona per copiare un componente pronto con supporto currentColor per Tailwind CSS.

SVG inline contro tag immagine

Usa SVG inline o componenti quando ti serve il cambio colore al passaggio e animazioni CSS. Usa il tag immagine con larghezza, altezza e testo alternativo se vuoi che la ricerca immagini indicizzi l icona.

Evita conflitti di ID di sfumature e clip

I set multicolore riusano spesso ID interni come paint0_linear. Se due icone condividono un ID nella stessa pagina, viene disegnata la sfumatura sbagliata. SVG Nexus assegna automaticamente un ambito a ogni ID per icona.

Icone accessibili e specchio RTL

Nascondi le icone decorative con aria-hidden e focusable false. Dai un aria-label chiaro ai pulsanti con sola icona. Specchia le frecce in orizzontale per le lingue da destra a sinistra.

Ripulire SVG di terze parti

SVG e un formato XML, quindi un file non fidato puo contenere script e gestori di eventi. Rimuovi i nodi script e servi i file SVG con una politica di sicurezza severa e l intestazione nosniff.