Type Logomark + WordmarkStroke 9pxStyle Flat geometricMascot Spio (separato)
Variante Attiva
Logo a colori brand
Il logo "ufficiale". Da usare ovunque possibile: sito web, dashboard del prodotto, presentazioni, header email, social, materiale marketing. È la prima scelta — preferiscila sempre quando il contesto te lo permette.
Su chiaro
fondo bianco / off-white
Su crema
fondo caldo / brand secondary
Su verde
verde brand su verde scuro
App icon
squircle iOS, light
Variante Passiva
Logo monocromatico
Da usare quando i colori brand non sono possibili o appropriati: stampe in bianco e nero, fax, fatture, timbri, contratti legali, supporti dove la riproduzione del colore non è garantita, sfondi colorati che entrerebbero in conflitto con il verde. Tre versioni mono coordinate.
Mono dark
verde scuro su chiaro
Mono nero
stampa B/N, fax, timbri
Mono crema
crema su verde scuro
Mono bianco
bianco puro su nero/scuro
Wordmark — Logo + Nome
Combinazione orizzontale
Il logo accompagnato dal nome "Spuncin". Da preferire negli header del sito, intestazioni di documenti, biglietti da visita. Mantenere lo spazio tra logo e testo proporzionato all'altezza del logo (~40%).
Spuncinattivo · su chiaro
Spuncinattivo · su scuro
Spuncinpassivo · mono nero
App Icon Sizes
Adattamento ai sistemi mobile
Per uso come app icon iOS/Android. Il logo è inserito in un squircle (quadrato arrotondato) seguendo le linee guida Apple. Tre dimensioni standard.
180×180
180×180 dark
120×120
87×87
Favicon & Small Sizes
Stress test alle piccole dimensioni
Verifica della leggibilità del logo W9 a dimensioni ridotte. Lo spessore aumentato regge bene fino a 16px.
64px
32px
24px
16px favicon
Color Tokens
Palette completa
I colori del brand con i loro ruoli specifici. Da copiare 1:1 in CSS, design system, materiali stampati.
Forest Dark
#064E3B
Primary · cerchio esterno, testo
Forest Bright
#10B981
Secondary · cerchio interno, accenti
Forest Light
#D1FAE5
Tint · backgrounds, hover
Cream
#F5E6D3
Surface caldo · doc, paper
Off White
#FAFAF9
Surface neutro · UI base
Pure Black
#0A0A0A
Mono · stampa B/N, dark mode
Usage
Cosa fare e cosa evitare
✓ Cosa fare
Usa la variante attiva ogni volta che possibile
Lascia almeno spazio = altezza logo / 2 attorno al marchio
Sui fondi scuri usa la versione su verde o mono crema
Mantieni gli stessi colori esatti dei token (no varianti random)
Per stampa B/N usa la versione mono nero
Per dimensioni < 24px verifica sempre la leggibilità
✗ Cosa evitare
Non aggiungere ombre, gradienti, riflessi 3D
Non ruotare il logo (anelli vanno orientati così)
Non cambiare i colori per "esigenze creative"
Non comprimere il logo verticalmente o orizzontalmente
Non mettere il logo su foto o sfondi visivamente rumorosi
Non usare insieme al logo della mascotte Spio nello stesso lockup formale
Ecosystem
Spuncin + Spio
Il sistema di brand opera su due livelli complementari: il logo Spuncin per usi formali e istituzionali, la mascotte Spio per marketing, social e contenuti emozionali. Mai sovrapposti nello stesso contesto formale.