ConfuMedia — kit di brand ========================= Cosa c'è dentro --------------- confumedia-colori.css Token di colore come variabili CSS. confumedia-colori.scss Gli stessi token per chi lavora in Sass. confumedia-tokens.json Tutti i token nel formato W3C Design Tokens: colori, caratteri, scala tipografica, spazi, raggi. Si importa in Figma con i plugin di gestione dei token. confumedia-palette.ase Palette per Photoshop, Illustrator, InDesign. confumedia-palette.svg Foglio della palette con i rapporti di contrasto. loghi/ Logo completo, pittogramma e logotipo in SVG: usa sempre questi quando puoi, scalano senza perdere qualità. loghi/png/ Le stesse forme esportate in PNG con sfondo trasparente, per chi non può usare SVG (PowerPoint, alcuni editor social). Le regole che contano --------------------- 1. Il colore --accent (#7B91FF) è decorativo. Il suo contrasto è 2,38:1 e non raggiunge la soglia richiesta: non usarlo mai per il testo. Per il testo di accento usa --accent-2 (#3B4CBF). 2. --polvere (#5E86AF) sta a 3,17:1: va bene per testo grande (da 24px, o da 19px in grassetto) e per gli elementi grafici. Non per il corpo. 3. Il corpo del testo parte da 17px. Le misure sono in rem, così chi ha impostato un carattere più grande nel browser lo ottiene davvero. 4. Il logo va sempre su fondo con contrasto sufficiente. Su fondo chiaro la versione a colori o nera; su fondo scuro quella bianca. Il pittogramma a colori usa #7B91FF: su fondo bianco il contrasto è 2,86:1, sufficiente per una forma grafica ma non per il testo. 5. Area di rispetto: metà dell'altezza del pittogramma su tutti i lati. Dentro quello spazio non entra nient'altro. 6. Dimensione minima. Lockup orizzontale: 120 px di larghezza sullo schermo, 30 mm in stampa. Pittogramma da solo: 24 px, 8 mm. Sotto quelle misure gli occhi del gatto si chiudono e il marchio diventa una macchia. 7. Cosa non fare: non ricolorarlo fuori dalle tre versioni, non deformarlo, non ruotarlo, non aggiungere ombre o contorni, non ricostruirlo affiancando pittogramma e logotipo a mano — il lockup ha proporzioni proprie. Caratteri --------- Sora titoli e interfaccia pesi 500, 600, 700 Manrope corpo del testo pesi 400, 500, 600, 700, 800 Questrial logotipo peso 400 JetBrains Mono dati ed etichette pesi 400, 700 Tutti disponibili su Google Fonts con licenza SIL Open Font License. Uso --- Questi materiali sono di Confumedia S.R.L. e servono a chi lavora su progetti ConfuMedia. Per usi diversi scrivi a dimmi@confumedia.com.