# Esportare SVG e PNG trasparente da Gradiently
[Canonical HTML page](https://gradiently.design/it/guide/export-svg-transparent-png)
A volte serve il design senza il riquadro intorno: un file scalabile per un sito, o le tue parole e il tuo logo su sfondo vuoto da posizionare sopra altro. Ecco cosa dà ogni esportazione e cosa no.
## The short version
- L’esportazione SVG di Gradiently mantiene le parole come testo vero nei loro caratteri, inclusi nel file, e tiene forme, icone, grafici e tabelle come vettori.
- Dentro un SVG il Mark e le eventuali foto sono immagini, quindi il file scala alla perfezione per testo e forme ma non all’infinito per lo sfondo.
- Un SVG contiene una pagina, quindi un carosello o una presentazione esportano un SVG per ogni pagina che scegli.
- Lo sfondo trasparente esporta solo i tuoi elementi come PNG, senza il Mark, pronti da posizionare su un’altra immagine o su un colore.
- Le esportazioni SVG e PNG trasparente fanno parte di Pro.
Per **esportare un SVG** da Gradiently, apri un design nello Studio, scegli **Esporta** e seleziona **SVG**. Le parole restano parole, nei loro caratteri inclusi nel file; forme, icone, grafici e tabelle restano vettori; il Mark e le foto entrano come immagini al suo interno. Per un **PNG trasparente**, scegli PNG e attiva **Sfondo trasparente**: ottieni solo i tuoi elementi su sfondo vuoto, senza il Mark. Entrambi fanno parte di Pro.
## SVG, PNG o PNG trasparente
| Esportazione | Cosa ottieni | A cosa serve |
| --- | --- | --- |
| **SVG** | Una pagina come file scalabile: testo vivo, forme vettoriali, il Mark come immagine | Siti web, passare un layout a uno sviluppatore, modifiche ulteriori in Figma o Illustrator |
| **PNG** | L’intero design in pixel, fino a 4K | Pubblicare sui social, messaggi, tutto ciò che deve solo avere un bell’aspetto |
| **PNG trasparente** | Solo i tuoi elementi, su sfondo vuoto | Un lockup del logo, un adesivo, parole da posare su una foto o un video |
Se ti serve solo un’immagine del design, il PNG è più semplice. Scegli l’SVG quando qualcuno modificherà o scalerà il file, e la trasparenza quando starà sopra qualcos’altro.
Il compromesso generale tra i due formati è spiegato in [SVG o PNG](https://gradiently.design/it/guide/svg-vs-png). Questa guida riguarda cosa mette Gradiently in ogni file.
## Cosa resta vettoriale in un’esportazione SVG
### Vettoriale: nitido a qualsiasi misura
- Le parole, come testo vero che puoi selezionare e modificare
- I caratteri, inclusi nel file
- Forme e linee
- Icone
- Grafici e tabelle
### Immagini dentro l’SVG
- Il Mark, lo sfondo vivo
- Le foto che hai aggiunto
- Qualsiasi carattere la cui licenza vieta l’incorporamento
Quindi un SVG è perfetto per un titolo che deve restare nitido su uno schermo 4K, o per un layout che uno sviluppatore inserirà in una pagina, ed è meno utile se speri di ingrandire lo sfondo a misura di cartellone. Il Mark viene reso come immagine alla misura del design; per uno sfondo più grande, esporta invece un PNG a una misura più alta. Un Mark è un rendering vivo e non un insieme fisso di forme vettoriali, ed è per questo che non può diventare un tracciato.
> **Caratteri e licenze** I caratteri del brand che carichi viaggiano dentro l’SVG solo quando la licenza del carattere stesso permette l’incorporamento. Se non lo permette, Gradiently disegna quel testo come pixel, così il file ha comunque il giusto aspetto. [Licenze dei font](https://gradiently.design/it/guide/font-licensing) spiega i flag.
## Come esportare un SVG
1. **Scegli la pagina** Un SVG contiene una pagina. In un carosello o in una presentazione, scegli la pagina in Esporta; ripeti per le altre.
2. **Scegli SVG** Apri **Esporta** e scegli **SVG**, descritto come scalabile, il testo resta testo. L’anteprima mostra la misura della pagina.
3. **Scarica** Scegli **Scarica SVG**. Il file si salva dove il tuo browser salva i download.
4. **Usalo sul web** Inseriscilo con un tag `img` per una grafica fissa, oppure incorporalo nell’HTML quando vuoi stilizzare il testo con il CSS.
```html
```
Dai sempre un vero testo alternativo a un SVG usato come immagine. Il [riferimento SVG](https://developer.mozilla.org/en-US/docs/Web/SVG) di MDN approfondisce il formato.
Un SVG si apre anche in strumenti di design come Figma e Illustrator, che leggono testo e forme vettoriali come livelli modificabili. Per questo è il file giusto da consegnare a chi deve adattare un layout a un formato che Gradiently non copre, come un cartello stampato con un suo modello, o uno sviluppatore che costruisce una sezione di pagina dal tuo design. Invia accanto il PNG come riferimento visivo, così può vedere esattamente come deve apparire il Mark.
## Come esportare un PNG trasparente
Scegli **PNG** in Esporta e attiva **Sfondo trasparente**. Tutto ciò che hai posizionato, parole, logo, forme, foto, resta; il Mark resta fuori e lo spazio intorno ai tuoi elementi è trasparente. Scegli una misura fino a 4K. Scritte, logo e slogan esportati così possono stare sopra una foto di prodotto, un video in un altro editor o una slide colorata.
Un design quadrato con il logotipo Northlight e un piccolo slogan su un gradiente caldo
Il design completo: il logotipo sul suo Mark, da pubblicare così com’è.
Lo stesso logotipo Northlight con lo slogan posato su un gradiente diverso, più freddo, dopo un’esportazione trasparente
Esportati con Sfondo trasparente, logotipo e slogan viaggiano da soli e possono essere posati su uno sfondo diverso, senza cambiamenti.
- **Controlla l’inchiostro rispetto a dove andrà.** Parole chiare esportate per un Mark scuro spariranno su una pagina bianca. Passa a un inchiostro scuro prima di esportare se la destinazione è chiara.
- **Rifila la pagina sul contenuto.** Un PNG trasparente mantiene la misura intera della pagina. Avvicina prima la pagina ai tuoi elementi se vuoi un file compatto.
- **Tieni entrambe le versioni del logo.** Esportane una per fondi scuri e una per fondi chiari, come fa un brand kit. [Logo su sfondo sfumato](https://gradiently.design/it/guide/logo-on-gradient-background) mostra perché.
- **Usa PNG, non JPEG.** Il JPEG non ha trasparenza; un design trasparente salvato come JPEG riceve uno sfondo pieno.
## Posizionare un PNG trasparente sul web
Un PNG trasparente si sovrappone in modo pulito a qualsiasi sfondo CSS, utile quando le parole sono fisse ma lo sfondo cambia per sezione o tema. Impilalo con un gradiente dietro e la tua grafica ci sta sopra.
```css
.launch-banner {
aspect-ratio: 1200 / 600;
background:
url("/images/launch-words.png") center / contain no-repeat,
linear-gradient(135deg, #1e1b4b 0%, #6d28d9 60%, #f0abfc 100%);
}
```
Il PNG trasparente sta sopra, il gradiente sotto. Cambia il gradiente per pagina e la grafica resta la stessa.
Da indaco a viola a orchidea: `linear-gradient(135deg, #1e1b4b 0%, #6d28d9 60%, #f0abfc 100%)`
Lo sfondo del codice qui sopra: indaco profondo che passa per il viola fino a un’orchidea tenue in basso a destra.
Per il caso opposto, un gradiente che sfuma nella trasparenza in CSS, vedi [gradiente CSS trasparente](https://gradiently.design/it/guide/css-gradient-transparent). E quando ti serve l’insieme di tutti i formati in un posto solo, [esportare i design](https://gradiently.design/it/guide/export-images-and-loops) copre insieme PNG, JPEG, PDF, video e GIF.
## FAQ
### Come esporto un SVG da Gradiently?
Apri il design, scegli Esporta, poi SVG, e scarica. Un SVG contiene una pagina, quindi in un design con più pagine scegli prima la pagina.
### L’esportazione SVG mantiene il testo modificabile?
Sì. Le parole restano testo vero, con i caratteri inclusi nel file, a meno che la licenza di un carattere vieti l’incorporamento: in quel caso quel testo viene disegnato come pixel.
### Lo sfondo a gradiente è vettoriale in un’esportazione SVG?
No. Il Mark è un rendering vivo, quindi viene incluso come immagine dentro l’SVG. Forme, icone, grafici, tabelle e testo sono vettori.
### Come esporto un PNG con sfondo trasparente?
Scegli PNG in Esporta e attiva Sfondo trasparente. I tuoi elementi restano e il Mark viene escluso, su sfondo vuoto.
### Posso esportare in SVG con il piano gratuito?
No. Le esportazioni gratuite sono PNG o JPEG a 720p con una piccola filigrana; SVG, PDF e PNG trasparente fanno parte di Pro.