In breve
- Un brand kit è la raccolta di file pronti all’uso che permette a chiunque di creare lavori in linea con il brand: loghi, codici colore, font, sfondi, template, immagini approvate e la guida di stile.
- I loghi entrano nel kit come SVG per gli schermi, PNG trasparente per gli strumenti di uso quotidiano e versioni a un colore in bianco e nero.
- I codici colore vanno indicati in tutte le notazioni che serviranno, di solito esadecimale e RGB per lo schermo e CMYK per la stampa.
- Sfondi e template sono le parti più usate e più spesso dimenticate di un brand kit.
- Un brand kit resta in ordine quando ha una sola casa, un solo responsabile, nomi di file chiari e una cartella d’archivio per ciò che è stato ritirato.
In questa pagina
Un brand kit è l’insieme di file pronti all’uso di cui chiunque ha bisogno per creare qualcosa in linea con il brand: file del logo, codici colore, font, sfondi, template, immagini approvate e una breve guida di stile. Dove la brand style guide spiega le regole, il kit consegna i materiali. Un buon kit permette a un freelance, a un nuovo collega o a un assistente AI di iniziare a lavorare in pochi minuti senza farti una sola domanda.
La checklist del brand kit
| Elemento | Cosa includere | Perché conta |
|---|---|---|
| Logo | SVG, PNG trasparente, versioni a un colore in nero e bianco, versione avatar quadrata | Ogni strumento e ogni sfondo richiede un file diverso |
| Colori | Nomi, codici esadecimali, RGB e CMYK, con il compito di ogni colore | Evita che si prendano colori dagli screenshot |
| Font | Nomi dei font con link o file per scaricarli, più note sulla licenza | Evita sostituti che cambiano tutta l’atmosfera |
| Sfondi | Sfondo distintivo nei formati più comuni, codice CSS, colore piatto di riserva | Riempie l’area più grande della maggior parte dei design |
| Template | I tuoi post, storie, slide e header email più frequenti | Il modo più rapido per restare coerenti |
| Immagini | Foto approvate, illustrazioni o set di icone | Impedisce alle foto stock di insinuarsi |
| Guida di stile | Le regole in una pagina, come PDF o link | Spiega quando usare ogni file |
Aiuta pensare a chi apre il kit e a cosa cerca per primo:
- Chi gestisce i social vuole template e sfondi nei formati giusti
- Chi sviluppa il sito vuole il logo SVG, i codici colore in CSS e le fonti dei font
- Chi stampa vuole il logo per la stampa, i valori CMYK e gli eventuali colori speciali
- Un nuovo collega vuole la guida di una pagina e un buon esempio per ogni formato
- Un assistente AI vuole le regole in testo semplice e i colori come codici
File del logo: quali formati servono
Un logo, più file. Ogni formato risolve un problema diverso, e quello sbagliato è di solito la causa di loghi sfocati, incorniciati o dai colori errati.
| Formato | Usalo per | Attenzione a |
|---|---|---|
| SVG | Siti web, app e tutto ciò che si ridimensiona | Alcuni strumenti d’ufficio e social non lo accettano |
| PNG, trasparente | Slide, documenti, strumenti social, email | Esportalo grande, ad esempio 2.000 px di larghezza, così resta nitido |
| PDF o EPS | Stampa, insegne e merchandising | Da inviare alle tipografie, non ai social |
| JPEG | Quasi mai per i loghi | Niente trasparenza, quindi arriva in un riquadro bianco |
Includi anche una versione che funzioni sul tuo sfondo distintivo. Un logo che sparisce sul tuo stesso gradiente è un problema comune e facilmente evitabile; mettere un logo su un gradiente spiega le soluzioni.
Colori, font e il resto delle basi
:root {
--night-blue: #0e1424; /* rgb(14 20 36) grounds, 60% */
--flour: #f3e6d0; /* rgb(243 230 208) text and panels, 30% */
--oven-glow: #e0823d; /* rgb(224 130 61) accents only, 10% */
--crust: #6b4a2f; /* rgb(107 74 47) support */
/* Signature background, with the flat fallback first */
--ground: #0e1424;
--ground-gradient: radial-gradient(90% 70% at 50% 110%, #e0823d 0%, #6b4a2f 25%, #1b2238 55%, #0e1424 100%);
}Per i font, annota da dove arriva ciascuno e cosa permette la sua licenza. Molti ottimi caratteri sono gratuiti su Google Fonts; i font commerciali spesso richiedono una licenza per persona o per sito, quindi scrivilo. Come scegliere i font del brand aiuta nella scelta vera e propria.
Sfondi e template: i file più usati
I loghi ricevono l’attenzione, ma sfondi e template ricevono l’uso. Prepara il tuo sfondo distintivo nei formati che pubblichi di più, così nessuno stira un’immagine quadrata fino a farne un banner. Poi costruisci i template sopra.
Post 4:5
1080 × 1350
Storia 9:16
1080 × 1920
Slide 16:9
1920 × 1080
Anteprima link
1200 × 630
Header email
1200 × 600
Banner LinkedIn
1584 × 396
Una struttura di cartelle per il brand kit che resta in ordine
brand-kit/
00-read-me-first.pdf (the one-page style guide)
01-logo/
cornerloaf-logo-primary.svg
cornerloaf-logo-primary.png
cornerloaf-logo-white.png
cornerloaf-logo-black.png
cornerloaf-avatar-square.png
print/cornerloaf-logo-primary.pdf
02-colour/
colours.css
colours.pdf (hex, RGB, CMYK, names, jobs)
03-type/
fonts.txt (names, links, licence notes)
04-backgrounds/
ground-1080x1350.png
ground-1080x1920.png
ground-1920x1080.png
05-templates/
06-imagery/
_archive/ (retired files, never deleted)Kit disordinato
- logo-finale-v3-NUOVO-usa-questo.png
- Cinque copie del kit su unità diverse
- Colori vecchi e nuovi affiancati
- Font nominati ma senza link
Kit in ordine
- brand-logo-bianco.png, nominato per ciò che è
- Una sola casa, richiamata da tutte le altre parti
- File ritirati spostati in _archive
- Ogni font con la sua fonte e la sua licenza
Come mantenere aggiornato un brand kit
- 1
Una casa, un responsabile
Tieni una sola copia principale e indica una persona che può modificarla. Tutti gli altri rimandano a quella invece di scaricare copie.
- 2
Nomina i file per ciò che sono
Brand, elemento, variante, formato. Mai «finale» o «nuovo»: smettono di essere veri la settimana dopo.
- 3
Archivia, non eliminare
Quando qualcosa viene ritirato, spostalo in una cartella d’archivio. I file vecchi accanto ai nuovi sono il modo in cui tornano i vecchi colori.
- 4
Rivedi a ogni cambiamento
Nuovo template, nuovo colore, nuovo lock-up del logo: aggiorna il kit lo stesso giorno, poi la guida di stile. Vedi la coerenza del brand per capire perché la deriva parte da qui.
Gradiently tiene un brand kit dentro lo Studio, con logo, colori e font a un clic da ogni design, e il Designer lo applica quando crea o modifica un lavoro. Se gestisci più di un brand, ognuno ha il suo kit e i suoi Mark. Configurare il brand kit in Gradiently lo spiega passo per passo.
Le domande più frequenti
Che cos’è un brand kit?
Un brand kit è una raccolta di file del brand pronti all’uso: loghi, codici colore, font, sfondi, template, immagini approvate e una breve guida di stile.
Quali file del logo devono stare in un brand kit?
Un SVG e un PNG trasparente del logo principale, versioni a un colore in bianco e nero, una versione avatar quadrata e un PDF o EPS per la stampa.
Che differenza c’è tra un brand kit e una guida di stile?
La guida di stile sono le regole; il brand kit sono i file. Il kit dovrebbe includere la guida, e la guida dovrebbe dire dove si trova il kit.
Come condivido un brand kit con un freelance?
Condividi il link all’unica cartella principale, con la guida di stile in cima. Evita di inviare copie, che si disallineano.
Scritto da Gradiently
Il team dietro Gradiently, uno strumento di design costruito attorno ai Mark: gradienti vivi che fanno sembrare tuo tutto ciò che progetti.
Vedi il nostro profilo
