PerfectVector
Di Irene Kim

Crea un logo a un colore senza perderne il disegno

Trasforma un logo multicolore in un solo colore uniforme conservando i dettagli essenziali. Usa lo spazio negativo, prova sfondi chiari e scuri e controlla la versione piccola.

10 min di lettura
In questa pagina

Per creare un logo a un colore, assegna alla grafica dipinta un unico colore uniforme e conserva i dettagli interni essenziali come spazio vuoto dove necessario. Cambiare tutti i riempimenti in nero può cancellare un simbolo che era visibile solo perché aveva un colore diverso.

Parti da un master vettoriale approvato o da una variante a un colore esistente. Lavora su una copia, decidi quali dettagli devono sopravvivere, poi controlla il risultato su più sfondi e alle dimensioni di visualizzazione previste. L'esempio qui sotto usa un distintivo originale con un fulmine per mostrare la decisione progettuale e la geometria SVG che la sostiene.

Parti dai file del logo approvati

Chiedi al proprietario del marchio una risorsa a un colore prima di ridisegnare il simbolo. Un marchio può già avere versioni separate a colori, a un colore e in negativo, ciascuna approvata per sfondi specifici.

Per esempio, le indicazioni sul marchio di Penn State descrivono una versione a un colore con aree interne trasparenti e avvertono di non crearla ridipingendo un'altra variante. È una regola di un marchio specifico, ma mostra perché la risorsa a un colore fornita può differire dal master a colori.

Se il disegno è tuo e devi creare la variante, conserva insieme questi elementi:

  • Un originale intatto e una copia di lavoro modificabile
  • Un elenco di dettagli identificativi, come un simbolo interno o l'apertura di una lettera
  • La dimensione di visualizzazione più piccola prevista e i probabili colori di sfondo
  • Il formato accettato dal destinatario e i requisiti dell'inchiostro, se è prevista la stampa

Un SVG è un file di grafica vettoriale, ma può contenere un'immagine a pixel invece di forme modificabili. Se resta solo un PNG o JPG, la guida alla vettorizzazione dei loghi spiega il passaggio di recupero della sorgente. Recuperare le forme e progettare una variante a un colore sono decisioni separate.

Decidi quali confini devono sopravvivere

Considera un distintivo circolare blu con un fulmine giallo. Il confine cromatico rende visibile il fulmine. Dare a entrambe le forme lo stesso riempimento antracite lascia un semplice cerchio: i tracciati esistono ancora, ma il colore condiviso nasconde la distinzione interna.

Lo spazio negativo è un'area non dipinta che rivela la superficie dietro la grafica. Rendere il fulmine uno spazio negativo conserva il motivo mentre il distintivo usa un solo colore dipinto.

Dettaglio nell'originaleDecisione per la versione a un colore
Simbolo interno essenzialeConservane il confine, eventualmente come apertura vuota
Variazione cromatica decorativaEliminala se il disegno si legge ancora correttamente
Apertura di una lettera o spazio tra elementiConserva una separazione sufficiente a restare visibile alle dimensioni previste

Per alcuni loghi basta sostituire il riempimento. In quel caso usa la guida alla ricolorazione SVG. Se mantieni più colori e unisci quelli quasi identici, segui prima il flusso di riduzione della tavolozza.

Sequenza concettuale da un distintivo blu con fulmine giallo a un semplice cerchio antracite, poi a un distintivo antracite con motivo del fulmine vuoto
Illustrazione concettuale: unire la colorazione nasconde il fulmine; usare lo spazio negativo ne conserva il confine. Il codice SVG qui sotto è l'esempio digitale verificato separatamente.

Costruisci l'apertura nella geometria SVG

Per un esempio riproducibile, salva questa grafica originale come original.svg. Un tracciato è una forma descritta da istruzioni di disegno; questo file ha un tracciato chiuso per il distintivo e un altro per il fulmine.

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
  <path fill="#0d6efd"
    d="M128 24 A104 104 0 1 1 128 232 A104 104 0 1 1 128 24 Z"/>
  <path fill="#f5d447"
    d="M142 54 L88 142 H120 L110 202 L174 108 H138 Z"/>
</svg>
  1. Apri l'originale in un browser per vedere il disegno a due colori.
  2. Salva una seconda copia e sostituisci entrambi i valori fill con #111827. Aprila di nuovo. Il fulmine ora si confonde con il distintivo.
  3. Salva il codice rivisto qui sotto come one-color.svg. Mantiene le stesse coordinate di disegno, ma inserisce entrambi i contorni in un solo tracciato.
  4. Apri il file rivisto su sfondi chiari e scuri, poi controllalo alle dimensioni di visualizzazione previste.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
  <path fill="#111827" fill-rule="evenodd"
    d="M128 24 A104 104 0 1 1 128 232 A104 104 0 1 1 128 24 Z
       M142 54 L88 142 H120 L110 202 L174 108 H138 Z"/>
</svg>

fill-rule determina quali aree interne a un tracciato ricevono colore. In questo esempio annidato, evenodd lascia non dipinta l'area del fulmine. La specifica SVG di fill-rule definisce questo comportamento. Il file contiene un riempimento uniforme e nessuna forma bianca in primo piano o rettangolo di sfondo.

Puoi creare questo tipo di apertura anche in un editor vettoriale. La documentazione Adobe sui tracciati composti spiega le aree trasparenti e le regole di riempimento disponibili. Il codice qui è SVG scritto direttamente, non un'esportazione di Illustrator; usa i controlli documentati del tuo editor e riapri il risultato salvato per controllare l'apertura.

Controlla lo sfondo e la versione piccola

Metti il logo rivisto su bianco e su uno sfondo scuro o colorato contrastante. Il fulmine dovrebbe mostrare ciascuno sfondo. Un fulmine dipinto di bianco rimarrebbe bianco sullo sfondo colorato, anche se su bianco sembrava un'apertura.

Per questo esempio originale, abbiamo renderizzato i file salvati a 256 e 32 pixel usando Sharp con librsvg. A entrambe le dimensioni, il campione interno del fulmine rivisto aveva alfa 0, cioè era completamente trasparente. Il controllo a colore uniforme era antracite opaco nello stesso punto; un controllo separato con sovrapposizione bianca era bianco opaco. Sono controlli digitali dei file scritti, non risultati di stampa o di importazione in un'applicazione.

A una vista effettiva di 32 pixel, il fulmine rivisto è rimasto distinguibile sugli sfondi bianco e ardesia esaminati. Questo stabilisce un controllo utile per il campione; non imposta una dimensione minima per un altro logo. Visualizza l'anteprima del tuo disegno alle dimensioni d'uso effettive invece di giudicare soltanto una tela ingrandita.

Prima di accettare la variante, verifica che:

  • Il motivo interno essenziale si legga ancora come previsto.
  • Le aree vuote rivelino lo sfondo anziché una macchia dipinta di bianco.
  • Piccoli spazi e aperture delle lettere rimangano visibili alla dimensione scelta.
  • Il file salvato si riapra con la geometria prevista e un solo colore uniforme.

Per una versione bianca in negativo di questo campione, cambia il fill del tracciato rivisto in #ffffff e conserva la stessa area vuota del fulmine. Controllala su uno sfondo scuro. Una risorsa di marca in negativo può richiedere una geometria diversa, quindi segui la versione fornita dal marchio quando esiste.

Correggi una variante che perde i dettagli

Che cosa vediChe cosa cambiare
Il simbolo interno scompare dopo la ricolorazioneRipristina un confine con spazio negativo deliberato o usa la variante a un colore approvata
Una presunta apertura resta bianca sopra una superficie colorataRimuovi la sovrapposizione dipinta e crea un'area realmente vuota
Uno spazio diventa difficile da leggere alla dimensione sceltaAllargalo o semplificalo entro le regole di approvazione del disegno, poi ripeti il controllo a piccole dimensioni
L'apertura si riempie dopo l'importazione nell'app di destinazioneEsamina i tracciati importati e la regola di riempimento; ricostruisci lì l'apertura se necessario e ricontrolla il risultato salvato

Evita di trasformare ogni area colorata in un foro. Un punto luce può essere superfluo, mentre l'apertura di una lettera porta significato. Decidi in base ai tratti identificativi del disegno, poi confronta la variante con l'originale. Se modifichi sostanzialmente la sagoma o le proporzioni interne, fai approvare la nuova variante prima di usarla come marchio.

Separa i requisiti di consegna dal progetto

Salva il master a colori, la versione scura a un colore e qualsiasi versione bianca in negativo approvata come file distinti. Mantieni la stessa tela e posizione quando devono sostituirsi nei layout.

Un riempimento SVG uniforme non assegna il nome di un inchiostro a tinta piatta dello stampatore e non crea una lastra di produzione. Conferma con il destinatario il nome del colore richiesto, le dimensioni fisiche, il tipo di file accettato e le ipotesi sullo sfondo. La guida ai formati dei file di logo tratta la scelta di un master modificabile e dei formati di consegna. Altri argomenti di preparazione dei loghi sono raccolti nelle guide a loghi e grafica.

Se l'unica sorgente è un PNG o JPG

Per un logo raster superstite adatto, il vettorizzatore di loghi di PerfectVector può aiutare a recuperare forme SVG. La sua anteprima è una vista raster protetta; modifica ed esportazione effettive dell'SVG diventano disponibili dopo aver sbloccato il risultato. Esamina le forme recuperate prima di usarle per costruire la variante a un colore.

Ricalcare i pixel non decide quale dettaglio debba diventare spazio negativo. Se la sorgente ha bordi sfocati, aperture mancanti o nessun confine visibile tra due aree, usa il master approvato o ridisegna deliberatamente la parte mancante. Ripeti i controlli di sfondo e piccole dimensioni dopo ogni modifica geometrica.

Domande frequenti

Che cos'è un logo a un colore?

Un logo a un colore usa un unico colore uniforme dipinto. Le sue aree vuote rivelano lo sfondo. Una versione scura e una bianca in negativo sono varianti separate, anziché due colori dipinti insieme nello stesso marchio.

Basta cambiare tutti i riempimenti in nero?

A volte. Se il colore è l'unico confine tra un simbolo essenziale e ciò che lo circonda, rendere uguali i riempimenti nasconde quel simbolo. Conserva il confine attraverso lo spazio negativo o usa una risorsa a un colore approvata.

Devo ricalcare un logo che è già grafica vettoriale?

No. Lavora con le forme modificabili esistenti e conserva l'originale. Il ricalco è una fase di recupero della sorgente per un'immagine a pixel adatta, non un requisito per creare una variante a un colore dalla geometria vettoriale.

Un riempimento SVG bianco specifica automaticamente inchiostro bianco?

No. Un riempimento bianco descrive il colore dipinto della grafica, mentre lo spazio vuoto non è dipinto. Lo stampatore determina come identificare e fornire l'inchiostro bianco nel proprio flusso di produzione.

Fonti

  1. Penn State: Colore e marchio — Un esempio specifico di varianti di marca approvate a un colore e in negativo, comprese le aree interne trasparenti.
  2. Adobe: Creare tracciati composti — Documenta aree trasparenti, regole di riempimento e direzione dei tracciati nei tracciati composti di Illustrator.
  3. W3C: SVG 2 fill-rule — Definisce quali aree di un tracciato composto ricevono colore nell'esempio SVG nativo.

Hai solo un PNG o JPG? Converti il tuo logo in SVG modificabile, sblocca il risultato, poi esamina le forme recuperate prima di creare e controllare la variante a un colore.

Altro dal blog

PerfectVector

Trasforma logo o grafica in un
SVG pulito e modificabile

Nessuna carta di credito