Ottimizzatore SVG

Ottimizza i file SVG per ridurne le dimensioni
  • I file non lasciano il dispositivo
  • Funziona nel browser
  • Gratis, senza account, senza filigrana

Drop SVG files here, or click to choose

Accetta SVG, SVGZ · Puoi anche incollare con Ctrl+V / ⌘V

Tip: paste SVG code anywhere on this page with Ctrl+V / ⌘V.

Come usare Ottimizzatore SVG

Riduci i file SVG con SVGO senza lasciare il browser. Scegli il preset Predefinito, Sicuro o Massimo oppure attiva e disattiva i singoli plugin, controlla un diff dei pixel rispetto all'originale ed esporta il risultato come SVG, data URI o componente React.

  1. 1

    Trascina file SVG o SVGZ sulla pagina, oppure incolla codice SVG; Esempio carica un esempio.

  2. 2

    Sotto Ottimizzazione, scegli Predefinito, Sicuro o Massimo e regola Precisione dei numeri, Multipass e Stampa formattata.

  3. 3

    Facoltativo: apri i gruppi Plugin per attivare o disattivare i singoli plugin SVGO; Reimposta torna a Predefinito.

  4. 4

    Confronta il risultato Affiancato, con il Cursore o sotto Differenze, dove i pixel cambiati appaiono in rosso.

  5. 5

    Scegli la scheda SVG, Data URI o React, poi fai clic su Scarica SVG o Scarica .jsx; per più file, usa Scarica tutto (ZIP).

Domande frequenti

I miei SVG vengono caricati?

No. SVGO gira in un worker in background nel browser, quindi i file non lasciano il dispositivo.

Ottimizzare cambia l'aspetto del mio SVG?

Il preset Predefinito punta allo stesso aspetto. Differenze renderizza entrambe le versioni e riporta la quota di pixel cambiati, oppure Sembra identico. Una Precisione dei numeri molto bassa può distorcere i dettagli fini.

Quale preset va bene per un SVG animato o con script?

Sicuro. Lascia invariati struttura, ID e forme, così i selettori CSS e gli script trovano ancora i loro elementi.

Perché Massimo ha rimosso larghezza e altezza?

Massimo toglie anche titoli, dimensioni e script, il che va bene per le icone usate tramite CSS o img; l'SVG si adatta allora al contenitore. Deseleziona removeDimensions sotto Incorporamento web per conservare la dimensione.

Meglio un data URI Base64 o codificato per URL?

Nella maggior parte dei casi lascia Base64 spento: l'URI codificato per URL di solito è più corto e si comprime meglio con gzip. Attivalo solo dove uno strumento si aspetta Base64.

Come funziona l'esportazione React?

La scheda React avvolge l'SVG ottimizzato in un componente JSX che prende il nome dal file, con gli attributi riscritti per JSX e le props passate all'elemento svg. Scarica .jsx lo salva.