# Importare il brand dal sito web: il brand kit in un passaggio
[Canonical HTML page](https://gradiently.design/it/guide/import-brand-from-website)
Il tuo sito conosce già il tuo nome, la tua frase di presentazione, il tuo colore e la tua icona. Un pulsante nella pagina Brand li legge e tu decidi cosa tenere.
## The short version
- Gradiently può leggere il sito web di un brand e proporre nome, descrizione, colore del tema e icona per il brand kit.
- Nulla viene aggiunto in automatico: ogni risultato compare come suggerimento che puoi usare o ignorare.
- Il nome arriva dai tag del nome del sito, la descrizione dalla meta description, il colore dal tag theme-color e l’icona dalla touch icon o dalla favicon.
- Un sito senza tag theme-color o con la sola icona SVG offre meno suggerimenti, perciò poche righe nell’head dell’HTML migliorano il risultato.
- La lettura del sito fa parte del brand kit, incluso in Gradiently Pro.
Per **importare il brand dal sito web** in Gradiently, apri la pagina Brand, scrivi l’indirizzo in **Sito web** sotto Identità e scegli **Leggi sito**. Gradiently recupera nome, descrizione, colore del tema e icona del sito, poi propone ciascun elemento: usa il nome, usa la descrizione come slogan o come Chi siamo, aggiungi il colore ai colori del brand, aggiungi l’icona come logo. Scegli tu cosa inserire. Bastano pochi secondi e ti risparmia la parte più noiosa della configurazione di un kit.
## Come importare il brand da un sito web
1. **Apri la pagina Brand** Scegli il brand da compilare. Ogni brand del tuo account ha il proprio kit, quindi assicurati di essere in quello giusto.
2. **Inserisci il sito web** Sotto **Identità**, scrivi l’indirizzo in **Sito web**. Basta un semplice dominio come `crumb.co`: non serve https.
3. **Scegli Leggi sito** Gradiently visita la pagina una volta, legge il suo head e recupera l’icona. Mentre lavora, il pulsante mostra **Lettura in corso…**.
4. **Usa ciò che funziona** Ogni risultato compare con il suo pulsante: **Usa “Crumb” come nome**, **Usa la descrizione come slogan**, **Usa la descrizione come Chi siamo**, **Aggiungi il suo colore**, **Aggiungi l’icona come logo**. Ignora ciò che non va.
5. **Rileggi dopo le modifiche** Se aggiorni il sito, scegli **Leggi di nuovo**. Quando tutto ciò che serve è già nel kit, la pagina te lo dice.
Il colore del sito compare poi anche come suggerimento nella sezione **Colori**, con il nome del tuo sito, così puoi aggiungerlo lì se la prima volta l’avevi saltato.
## Cosa legge Gradiently dal tuo sito
Legge solo la homepage pubblica all’indirizzo che indichi, e solo le parti che descrivono il brand. Non esplora le altre pagine, non fa login e non legge i tuoi contenuti.
| Suggerimento per il kit | Da dove arriva | Diventa |
| --- | --- | --- |
| Nome | `og:site_name`, `application-name` o il titolo della web app Apple | Nome del brand |
| Descrizione | `meta name="description"` o la descrizione Open Graph | Slogan o Chi siamo |
| Colore | `meta name="theme-color"` in esadecimale o rgb() | Un colore del brand |
| Icona | La `apple-touch-icon` più grande, altre icone raster, poi `/favicon.ico` | Un logo, fino a 256 px |
Quattro suggerimenti e le loro fonti. L’icona viene ridisegnata come PNG di al massimo 256 px prima che Gradiently la conservi.
Due dettagli da sapere. Le icone SVG vengono saltate, perché Gradiently non converte in raster l’SVG di qualcun altro: un sito con la sola favicon SVG non dà nessuna icona. E il colore deve essere un semplice valore esadecimale o rgb(): una variabile CSS nel tag theme-color non si può leggere.
## Rendi il tuo sito facile da leggere
Se Leggi sito restituisce poco, la soluzione di solito sono poche righe nell’head HTML del tuo sito. Aiutano più di Gradiently: i browser usano theme-color per la barra degli indirizzi sui telefoni e le anteprime dei link usano i tag Open Graph. Approfondisci con [Open Graph tags](https://gradiently.design/it/guide/open-graph-tags) e [favicon design](https://gradiently.design/it/guide/favicon-design).
```html
Crumb · Sourdough bakery in Leeds
```
Tutto ciò che cerca Leggi sito: il nome del sito, una descrizione di una riga, un colore del tema in esadecimale e una touch icon raster da 180×180.
### Dà poco
- Nessuna meta description, o una piena di parole chiave
- Nessun tag theme-color, o una variabile CSS al suo interno
- Solo una favicon SVG
- Una homepage che rimanda a una schermata di login
### Dà un buon punto di partenza
- Una frase onesta su quello che fai
- Un colore del tema esadecimale coerente con il logo
- Una touch icon PNG da 180×180
- Una homepage pubblica che si carica in fretta
## Cosa fare dopo l’importazione
L’importazione ti dà una base, non un kit finito. Vale la pena fare quattro cose, in quest’ordine.
1. **Carica i file del logo veri e propri.** Una favicon è minuscola e quadrata. Aggiungi il logo completo in PNG, JPEG, WebP, GIF o AVIF, uno per sfondi scuri e uno per sfondi chiari; vedi [logo on a gradient background](https://gradiently.design/it/guide/logo-on-gradient-background).
2. **Completa i colori.** Un solo colore del tema è un inizio. Aggiungi un colore di supporto e i tuoi neutri più scuro e più chiaro; [how to choose brand colors](https://gradiently.design/it/guide/how-to-choose-brand-colors) ti aiuta.
3. **Imposta i font.** Scegli un carattere per i titoli e uno per il testo, oppure [carica i tuoi file font](https://gradiently.design/it/guide/custom-fonts-upload).
4. **Scrivi la voce.** La descrizione di un sito dice al Designer che cosa sei, non come parli. Compila Tono, Con parole tue, Sempre e Mai; [brand voice for AI](https://gradiently.design/it/guide/brand-kit-voice) ti mostra come.
Un post Instagram che presenta Crumb, un panificio a lievito madre, con il nome e la descrizione letti dal suo sito web
Un primo post subito dopo l’importazione: nome e descrizione presi dal sito.
La stessa presentazione di Crumb come Storia Instagram verticale
Lo stesso brand come storia a 1080×1920, pronto quando il kit è impostato.
## Quando la lettura del sito non riesce
Se vedi **Non siamo riusciti a leggere quel sito**, la pagina non ha risposto in tempo, ha restituito un errore o ha bloccato la richiesta. Controlla che l’indirizzo si apra in una finestra privata del browser. Gli indirizzi che puntano a una rete privata, a una pagina di login o a un file invece che a una pagina web vengono rifiutati di proposito. Un sito dietro un filtro anti-bot severo potrebbe non essere mai leggibile: inserisci i dati a mano, ci vogliono un paio di minuti.
> **Chi può farlo** La lettura del sito fa parte del brand kit, incluso in Pro. In uno spazio di lavoro condiviso solo proprietari e amministratori possono modificare un brand kit. Gradiently legge il sito una volta, quando lo chiedi, senza cookie né credenziali.
Con il kit compilato, lo Studio mette i tuoi colori per primi in ogni selettore, propone i tuoi loghi e avvia i design con i tuoi font, e il Designer scrive partendo dalla tua descrizione. Abbinalo a un Mark che nessun altro può usare e i tuoi post ti somiglieranno fin dal primo. Il resto del kit è spiegato in [brand kit setup](https://gradiently.design/it/guide/brand-kit-setup).
## FAQ
### Come ricavo i colori del brand dal mio sito?
In Gradiently inserisci il tuo sito nella pagina Brand e scegli Leggi sito. Se il tuo sito ha un tag theme-color, il suo colore viene proposto come colore del brand.
### Perché Leggi sito non ha trovato il mio logo?
Cerca icone raster come una apple-touch-icon o favicon.ico e salta le icone SVG. Aggiungi al sito una touch icon PNG, oppure carica direttamente il tuo logo.
### L’importazione sovrascrive il mio brand kit?
No. Ogni risultato viene proposto come suggerimento e nel kit non cambia nulla finché non scegli di usarlo.
### Posso importare un brand dal sito di qualcun altro?
Lo strumento legge qualsiasi sito pubblico, ma usalo per brand che gestisci o per cui lavori. Il kit dovrebbe contenere risorse che hai il diritto di usare.
### E se il mio sito non ha una descrizione?
Leggi sito ti proporrà comunque ciò che trova. Scrivi a mano slogan e Chi siamo e valuta di aggiungere una meta description al sito, che aiuta anche nei risultati di ricerca.