Ridurre i colori di un SVG senza rovinare la grafica
Riduci la tavolozza SVG in base al ruolo visivo, non a un numero arbitrario. Unisci colori simili conservando contrasto, spazi vuoti, livelli e operazioni.
In questa pagina
- Ricolorare e ridurre i colori sono lavori diversi
- Prima trova i colori effettivamente usati nel file
- Dai ai colori nomi basati sul ruolo
- Unisci i colori simili in un editor vettoriale
- Cosa può e non può fare il raggruppamento automatico
- Quando rasterizzare e ricalcare è ragionevole
- Verifica il file ridotto
- Dove serve PerfectVector
- Domande frequenti
- Fonti
Per ridurre in sicurezza i colori di un SVG, raggruppali secondo la loro funzione nella grafica e poi unisci i quasi duplicati all'interno di ciascun gruppo. Mantieni separati i colori con significati diversi, come luci e ombre, primo piano e sfondo oppure operazioni di taglio e marcatura.
L'errore comune è scegliere un obiettivo come «quattro colori» e lasciare ogni decisione a uno strumento di raggruppamento automatico. Può essere un primo passaggio utile, ma la tavolozza finale richiede una verifica visiva e produttiva. Due blu quasi identici possono essere uniti senza problemi. Due grigi altrettanto simili possono invece essere l'unico contrasto che distingue un occhio dal volto.
Una riduzione sicura della tavolozza
- Salva una copia intatta.
- Elenca riempimenti, tratti, gradienti e opacità.
- Assegna ai colori un nome basato sul ruolo prima di cambiare i valori esadecimali.
- Unisci colori simili un ruolo alla volta.
- Controlla contrasto, fori e piccoli dettagli alle dimensioni finali.
- Per Cricut o file produttivi, verifica che colori delle operazioni e livelli mantengano lo stesso significato.
Ricolorare e ridurre i colori sono lavori diversi
Ricolorare significa sostituire un valore con un altro. Se un logo blu diventa verde ma usa ancora lo stesso numero di riempimenti, la dimensione della tavolozza non cambia.
La riduzione dei colori fa convergere più valori in un numero inferiore di valori. Un ricalco può contenere #173f75, #184076 e #194177 perché i pixel con antialiasing sono diventati regioni separate. Assegnare a tutti e tre lo stesso blu riduce la tavolozza e, dopo la pulizia della geometria, il numero di frammenti da gestire.
| Lavoro | Prima | Dopo |
|---|---|---|
| Ricolorazione | Tre blu | Tre verdi |
| Riduzione della tavolozza | Tre blu quasi identici | Un blu |
| Riduzione dei livelli | Diverse forme o livelli con lo stesso ruolo | Un livello produttivo, dove la geometria lo consente |
Queste operazioni possono avvenire insieme, ma non sono intercambiabili. La guida a come cambiare i colori SVG tratta la sostituzione diretta dei colori. Questo articolo aiuta a decidere quali colori possono diventare uno solo.
Una volta definita la tavolozza, il procedimento di separazione dei colori sulla stessa tavola da disegno esporta un file allineato per ogni colore esatto, senza annullare quelle decisioni.
Prima trova i colori effettivamente usati nel file
Apri l'SVG in un editor vettoriale che elenchi i colori del documento o selezioni gli oggetti per riempimento. Illustrator, per esempio, documenta la selezione di oggetti con lo stesso riempimento e tratto. Per un file semplice, anche un editor di testo mostra i valori espliciti fill e stroke.
Conta più dei soli codici esadecimali:
- Riempimenti pieni delle forme
- Colori dei tratti dei contorni
- Punti di colore dei gradienti
- Opacità che fa apparire un colore più chiaro sopra uno sfondo
- Stili memorizzati in classi anziché direttamente sulle forme
- Immagini raster incorporate, i cui colori dei pixel non costituiscono una tavolozza SVG
Dieci valori esadecimali elencati non significano sempre dieci colori visibili. Lo stesso valore a opacità diverse può apparire diverso. Un gradiente può contenere solo due punti di colore ma mostrare molti toni intermedi. Un <image> raster può mostrare migliaia di colori mentre l'SVG circostante ha un solo riempimento. La specifica di pittura SVG distingue colori pieni, gradienti, motivi, opacità di riempimento e tratto e altri comportamenti di pittura.
Se il file contiene un raster dentro un contenitore anziché forme modificabili, la riduzione dei colori va eseguita prima o durante un nuovo ricalco. Il controllo degli SVG pixelati ti dirà se esistono veri tracciati da modificare.
Dai ai colori nomi basati sul ruolo
Prima di cambiare i valori, crea una piccola mappa della tavolozza:
| Ruolo | Colori attuali | Tenerli separati? |
|---|---|---|
| Silhouette principale | Blu navy scuro, quasi navy | Di solito unirli |
| Luce | Azzurro chiaro | Conservarlo se definisce la forma |
| Contorno | Nero | Conservarlo se il bordo è intenzionale |
| Sfondo | Rettangolo bianco | Rimuoverlo se è prevista trasparenza |
| Operazione di taglio | Rosso | Mantenerlo separato da marcatura o incisione |
Questo impedisce alla somiglianza automatica di prendere la decisione sbagliata. La distanza cromatica è utile, ma prevale il contesto. Una piccola luce accanto a una forma scura può richiedere una separazione numerica inferiore rispetto a due grandi regioni di sfondo, eppure contribuire maggiormente alla leggibilità.
Associa i colori simili ai loro compiti prima di scegliere quelli da conservare. Una tinta di sfondo, un riempimento principale, un contorno e un accento focale possono essere numericamente vicini ad altri campioni, ma ciascuno ha un motivo diverso per restare distinto.

Nei file da taglio, il ruolo può essere letterale. In Cricut Design Space, gli SVG importati conservano livelli separati e il controllo Operation assegna ai livelli selezionati comportamenti come Basic Cut, Draw, Score ed Engrave. In altri procedimenti laser o CNC, i colori possono essere usati anche per organizzare le operazioni. Non unire livelli che indicano operazioni solo perché i colori sembrano simili sullo schermo.
Unisci i colori simili in un editor vettoriale
Procedi dalla coppia meno rischiosa a quella più visibile.
- Duplica il file o la tavola da disegno.
- Seleziona un colore candidato con Select Same Fill o il comando equivalente dell'editor.
- Sostituiscilo temporaneamente con il colore vicino della tavolozza.
- Controlla piccoli elementi, intersezioni e spazi negativi alle dimensioni normali di visualizzazione.
- Alterna la copia originale e quella ridotta.
- Mantieni l'unione solo se gerarchia delle forme e significato produttivo sono conservati.
- Ripeti con la coppia successiva.
Quando i colori coincidono, le forme adiacenti non diventano automaticamente un solo tracciato. Uniscile solo se devono essere un'unica forma modificabile o da tagliare. Due oggetti possono condividere un riempimento restando separati per animazione, impaginazione o modifica.
Qui conta anche la qualità di nodi e frammenti. Se un unico blu visivo è diviso in centinaia di striscioline, selezionare per riempimento aiuta, ma il file può restare difficile da modificare. Un ricalco più pulito può essere più rapido della riparazione di ogni frammento.
Cosa può e non può fare il raggruppamento automatico
Gli strumenti per tavolozze spesso raggruppano i colori in base alla distanza numerica. K-means e metodi simili possono trasformare un lungo elenco di valori vicini in un numero scelto di colori rappresentativi. È utile per illustrazioni create da sorgenti raster rumorose.
Il raggruppamento automatico non sa:
- quale elemento sia un volto, una lettera, un foro o un contorno;
- quali colori indichino operazioni della macchina;
- se un piccolo accento abbia un significato per il marchio;
- se la trasparenza su uno sfondo abbia creato il colore apparente;
- se due forme debbano restare modificabili indipendentemente.
Usa il risultato come bozza. Confrontalo alle dimensioni finali, non soltanto ingrandito. Un'unione apparentemente innocua all'800% può cancellare un piccolo occhio o una controforma alle dimensioni di un adesivo.
Quando rasterizzare e ricalcare è ragionevole
Esportare l'SVG in PNG, ridurre la tavolozza raster e ricalcarlo di nuovo è un azzeramento distruttivo. Appiattisce gruppi, nomi, simboli riutilizzabili, struttura del testo e tracciati posizionati con cura in pixel, prima di ricostruirli.
Usa quel percorso solo quando la struttura SVG attuale è già inutilizzabile e non hai una sorgente più pulita. Può aiutare con un ricalco automatico molto frammentato il cui unico valore è l'aspetto. Conserva l'SVG esistente come riferimento, esporta un raster grande con trasparenza, riduci i colori deliberatamente, poi ricalca e controlla i nuovi tracciati.
Non rasterizzare un SVG pulito e organizzato solo per cambiare quattro riempimenti. La modifica vettoriale diretta conserva molte più informazioni.
Verifica il file ridotto
Esegui questi controlli prima di sovrascrivere qualsiasi cosa:
- Visualizzalo su sfondi chiari e scuri.
- Controlla silhouette e spazi negativi.
- Verifica che i contorni non siano scomparsi nei riempimenti.
- Controlla gradienti e opacità separatamente dai colori pieni.
- Conta i livelli finali Cricut o le operazioni produttive.
- Guarda testo piccolo e icone alle dimensioni reali di uscita.
- Riapri l'SVG esportato in un altro visualizzatore.
Se il file è per Cricut, il procedimento SVG a livelli spiega come i colori corrispondano a materiali e assemblaggio. La guida ai file difficili da spellicolare tratta i problemi geometrici che la sola riduzione dei colori non risolve.
Dove serve PerfectVector
PerfectVector non modifica un SVG esistente. Aiuta quando la proliferazione dei colori nasce da un'immagine raster. Il procedimento SVG per Cricut converte la sorgente in tracciati modificabili e permette di controllare e regolare le regioni cromatiche ricalcate prima del download.
Usalo quando un PNG o JPG ha prodotto decine di colori simili e livelli frammentati in un altro convertitore. Parti dal raster più pulito disponibile, elimina ombre indesiderate o variazioni dello sfondo e confronta l'anteprima vettoriale. Unisci i colori secondo i livelli di materiale che prevedi davvero di tagliare.
L'obiettivo non è sempre il minor numero possibile di colori. È la tavolozza più piccola che comunica ancora il disegno e il piano produttivo.
Domande frequenti
Come riduco il numero di colori in un SVG? Elenca riempimenti, tratti, gradienti e opacità del file, raggruppali per ruolo visivo o produttivo, poi unisci i quasi duplicati una coppia alla volta. Usa la selezione per riempimento in un editor vettoriale e confronta con una copia intatta dopo ogni unione.
Assegnare lo stesso valore esadecimale a due riempimenti unisce i livelli SVG? Non necessariamente. Le forme ora condividono un colore, ma restano oggetti separati finché non unisci o combini la geometria. Tenerle separate può essere utile per modifica, animazione o impaginazione anche se vengono tagliate nello stesso materiale.
Posso limitare automaticamente un SVG a quattro colori? Gli strumenti di raggruppamento della tavolozza possono produrre una bozza a quattro colori, ma non comprendono dettagli semantici o operazioni produttive. Controlla piccoli elementi, contrasto, fori, gradienti e significato dei livelli prima di usare il risultato.
Perché il ricalco di un'immagine a quattro colori ne ha creati a decine? Il raster probabilmente conteneva antialiasing, ombre, variazioni da compressione o bordi ammorbiditi. Il ricalcatore ha trattato quelle differenze tra pixel come regioni separate. Pulisci selettivamente il raster o unisci i colori simili nel risultato vettoriale.
Devo ridurre i colori SVG prima del caricamento in Cricut? Di solito sì quando diversi colori sono quasi duplicati involontari. Prevedi un colore significativo per ogni materiale o livello, conserva ciò che deve essere tagliato separatamente e verifica il numero di livelli dopo l'importazione. Pochi livelli deliberati sono più facili da tagliare e assemblare di un ricalco pieno di minuscole variazioni cromatiche.
Fonti
- W3C — Pittura SVG 2 — Definisce riempimenti, tratti, gradienti, motivi e opacità di pittura.
- Adobe Illustrator — Selezionare oggetti con lo stesso riempimento e tratto — Documenta un procedimento pratico di selezione per aspetto.
- Cricut — Caricare immagini in Design Space — Spiega come i livelli SVG vengono conservati nel caricamento.
- Cricut — Selezionare Operation — Definisce le operazioni della macchina assegnate ai livelli Design Space.
Se il problema della tavolozza nasce da un'immagine raster, preparala per Cricut e controlla i colori ricalcati. Tieni l'originale accanto all'anteprima e approva ogni unione in base al materiale finito, non soltanto allo schermo.
Altro dal blog

Controllare un SVG prima di tagliarlo o acquistarlo
Controlli in cinque minuti per file da taglio: falsi vettori, tracciati doppi, troppi nodi e riquadri nascosti, più cosa verificare prima dell'acquisto.

SVG feColorMatrix: ricolora senza cambiare i fill
Usa SVG feColorMatrix per ricolorare un'anteprima, mantenere la trasparenza e scegliere sRGB. Confronta il filtro con le modifiche dirette ai riempimenti.