svg2all

Riparare la viewBox di un SVG

Aggiunge la viewBox mancante da width e height, così l'SVG finalmente si ridimensiona – nel browser.

Funziona nel tuo browser – il file non viene caricato

Caricamento dello strumento …

Domande frequenti

Il mio file viene caricato?

No. La conversione avviene interamente nel tuo browser. Il file non lascia mai il tuo dispositivo – non c'è alcun server che possa vederlo. Una volta caricata la pagina, lo strumento funziona persino offline.

A cosa serve la viewBox e perché manca?

La viewBox dice al browser quale porzione del disegno mostra il file e permette all'SVG di scalare a qualsiasi dimensione. Alcuni esportatori scrivono solo width e height; un file così viene sempre mostrato a quella dimensione fissa – un'icona da 24 px resta 24 px per quanto la ingrandisci, oppure viene tagliata. Una viewBox coerente con width e height risolve il problema senza modificare il disegno.

Cosa viene modificato esattamente?

Solo il tag radice <svg>: la viewBox viene aggiunta se manca o riscritta se è malformata (numero di valori sbagliato, dimensione zero o negativa). width e height in pt, mm, cm o in vengono convertiti in pixel a 96 dpi, come definito dal CSS. Tutto il resto del file resta identico byte per byte – una viewBox valida non viene mai toccata.

Quando devo rimuovere width e height?

Quando l'SVG deve adattarsi al suo contenitore: icone inline, loghi responsive, sfondi CSS. Senza width e height il browser usa le dimensioni del CSS o del tag <img>, mantenendo le proporzioni della viewBox. Tienili per un file che deve avere una dimensione naturale fissa, come un'esportazione per la stampa.

Perché dice che la dimensione è sconosciuta?

width e height in percentuale, em o ex dipendono dal contesto, quindi non se ne ricava una dimensione in pixel. Apri il file nel tuo editor, imposta una dimensione assoluta (ad esempio 64 × 48 px) e riprova.