PerfectVector
Por Irene Kim

Camadas PNGtoSVG: remova cores e adicione marcas de registro

Remova uma cor da paleta em PNGtoSVG, salve o SVG e verifique seus caminhos compostos e marcas de alinhamento opcionais antes de levar a arte em camadas para seu próximo aplicativo.

9 min de leitura
Nesta página

Os controles de paleta do PNGtoSVG permitem remover uma cor detectada e adicionar marcas de registro correspondentes à geometria da cor. Salve o resultado após cada alteração e inspecione o SVG exportado. O contador de caminho da interface e o número de elementos de caminho SVG podem descrever coisas diferentes, portanto, nenhum dos números indica quantas peças úteis você possui.

Este fluxo de trabalho usa PNGtoSVG.com, cuja interface atual inclui um link Clássico separado. Ele segue uma fonte através de uma linha de base, remoção de branco e exportação de marca de registro. O resultado é um arquivo SVG verificado; a importação de máquinas e o alinhamento de materiais ainda precisam de seus próprios testes.

Experimente com a sua própria imagem
Abrir a ferramenta completa
Teste grátis. Solte uma imagem e veja a prévia do seu vetor, sem precisar criar conta.

Escolha as cores que você precisa manter

Você precisa de uma imagem raster permitida, um original retido e nomes de arquivos separados para suas exportações. Decida se o branco é um fundo indesejado, uma obra de arte branca pretendida ou ambos. Uma paleta é o conjunto de cores do traço; remover uma cor pode afetar todas as regiões atribuídas a esse preenchimento.

Nosso controle original era um 384 × 256 RGB PNG em branco opaco. Tinha uma moldura azul marinho com centro branco, um triângulo verde-azulado, um retângulo dourado e dois pequenos quadrados azul marinho. Nós o reutilizamos inalterado e testamos o site ativo em 8 de novembro de 2026. O site exibiu um aviso de baixa resolução para esta fonte, que permanece visível na imagem abaixo.

Método: Mantivemos três exportações SVG reais e comparamos seu XML, preenchimentos e limites de documentos. Este é um pequeno controle geométrico, não um benchmark de qualidade fotográfica, uma comparação PerfectVector ou um teste de importação/corte Cricut.

Salve uma linha de base e remova a cor branca da paleta

  1. Abra PNGtoSVG.com e use navegar pelos arquivos para selecionar sua fonte. Aguarde o resultado do vetor em vez de confiar na visualização da imagem original.
  2. Mantenha o resultado inicial automático para sua primeira comparação. Nossa execução usou Logo/Clip art, High, cores 10, detalhe 84, suavização 0, speckle 5 e canto 45; a paleta detectada continha quatro cores. Estas são configurações de teste gravadas, não uma predefinição recomendada para cada imagem.
  3. Deixe as marcas de registro desativadas e use Download para salvar baseline.svg.
  4. Encontre a entrada da paleta branca e selecione seu controle de remoção ×. Aguarde a atualização do resultado e salve um white-removed.svg separado.
  5. Compare o resultado salvo com o original, especialmente quaisquer detalhes brancos pretendidos e pequenas marcas isoladas.

As FAQ da paleta do PNGtoSVG descrevem × como a remoção dos caminhos da cor. Trate isso como uma mudança de geometria, em vez de simplesmente pintar o branco com uma cor diferente. Se letras brancas ou destaques brancos pertencerem ao seu design, inspecione-os antes de manter esta variante.

Em nossa linha de base salva, quatro elementos de caminho carregavam quatro cores de preenchimento, incluindo branco. Após a remoção do branco, o SVG apresentava três elementos de caminho e nenhum preenchimento branco. O centro da moldura azul marinho apareceu no tabuleiro de xadrez na comparação do site, enquanto o centro do original permaneceu branco.

Se a remoção perder a arte desejada, restaure a cor ou recarregue o original e reconstrua a partir da linha de base salva. Não fique mudando a paleta em cima de um resultado que já falha em um detalhe importante.

Entenda os caminhos das cores antes de contar as camadas

A interface exibia 11 caminhos para nossa linha de base, mas o SVG baixado continha quatro <path> elementos. Após a remoção do branco, a interface exibia 5 caminhos, enquanto o arquivo continha três elementos de caminho.

Um caminho composto é um elemento de caminho que contém vários subcaminhos. O SVG permite explicitamente esta construção, incluindo contornos separados e aberturas interiores dentro de um elemento. A especificação do caminho SVG explica esse relacionamento. Nesta exportação, a geometria com o mesmo preenchimento compartilhava um elemento de caminho, portanto a contagem de elementos XML não correspondia ao contador da interface.

Use o contador para acompanhar a visualização da ferramenta e, em seguida, inspecione como seu aplicativo de destino apresenta a geometria salva. Um caminho de cores pode conter diversas peças desconectadas. Isso não prova uma camada de editor nomeada para cada objeto visual e não prova que pequenos pedaços serão fáceis de cortar ou colocar.

Para a próxima etapa de preparação, nosso guia SVG em camadas separa a organização de cores de um projeto pronto para máquina. Se você precisar de um arquivo por cor, veja como separar cores SVG em arquivos.

Adicione marcas de registro somente quando precisar de auxílios de alinhamento

O FAQ do PNGtoSVG descreve suas marcas de registro como geometria de canto correspondente adicionada a cada camada de cor. Estas são ajudas de alinhamento para o trabalho artístico colorido. Elas não são comprovadas aqui como marcas de sensor Cricut Print Then Cut ou como um substituto para o fluxo de trabalho de impressão e corte da própria máquina.

Com a cor branca ainda removida, habilite marcas de registro e salve um terceiro SVG como white-removed-registration-marks.svg. Compare-o com a exportação não marcada em vez de substituir esse arquivo.

Visualização PNGtoSVG real lado a lado da fonte branco opaco e um resultado vetorial com regiões brancas transparentes e quatro pequenos quadrados de alinhamento de canto
Original à esquerda; resultado removido de branco com marcas de registro à direita. O aviso de resolução de origem é mantido.

Nossa exportação marcada ainda tinha três elementos de trajetória. Cada caminho de cor continha os mesmos quatro 8 × 8 subcaminhos quadrados nos cantos. As marcas expandiram seu viewBox de 0 0 384 256 para -20 -20 424 296; sua largura e altura também mudaram de 384 × 256 para 424 × 296.

O viewBox descreve a região de coordenadas SVG usada para o desenho. Neste exemplo, os limites maiores incluem a geometria fora da área da imagem original. Tenha essa diferença em mente ao comparar as dimensões do documento. Isso não significa que a obra de arte central foi dimensionada para um novo tamanho físico.

ExportarElementos do caminho SVGBytesLimites de documentos salvos
Linha de base43,1060 0 384 256
Branco removido31,6480 0 384 256
Branco removido, marcas em32,024-20 -20 424 296

A geometria quadrada correspondente é verificada nesses arquivos. O alinhamento bem-sucedido do material real não foi testado. Mantenha uma cópia não marcada e decida no aplicativo de destino se as formas extras pertencem à operação que você está preparando.

Verifique o arquivo salvo antes de fazer um projeto artesanal

Abra o SVG aceito independentemente da visualização do site. Verifique se as cores pretendidas permanecem, se o branco removido não apaga a arte desejada e se as peças coloridas separadas ainda ocupam as posições esperadas. Se as marcas estiverem habilitadas, inspecione todos os quatro cantos e os novos limites do documento.

Para o corte, as demais verificações pertencem ao seu aplicativo de recebimento: dimensões físicas, pequenos detalhes, atribuição de cores e a operação aplicada aos auxiliares de alinhamento. Faça um pequeno teste de material antes de repetir um projeto. Um download bem-sucedido do navegador não conclui essas etapas.

O guia de seleção do conversor Cricut cobre outras rotas iniciais. Fique com PNGtoSVG quando seus controles de paleta e geometria salva atenderem ao seu trabalho. Use um traço diferente ou edição manual se as regiões importantes permanecerem estranhas após um teste limitado.

Quando um rastreamento automático é a próxima etapa útil

PerfectVector é adequado quando você deseja iniciar a partir do raster original e inspecionar um traço automático antes de fazer a preparação do artesanato. Use a página SVG para Cricut com sua própria imagem e, em seguida, inspecione a menor peça necessária, as aberturas internas e cada região de cor. Esta é uma opção de rastreamento separada, não uma afirmação de que sua saída foi medida em relação a PNGtoSVG neste teste.

Os fatos do produto da PerfectVector descrevem uma visualização gratuita somente para visualização; você deve desbloquear um resultado antes de poder editá-lo ou exportá-lo. O arquivo resultante ainda precisa de verificações no aplicativo receptor. Se você já possui uma geometria aceitável, refazê-la não adiciona nenhuma etapa de preparação necessária.

Perguntas frequentes

Por que a interface mostrou mais caminhos do que o arquivo SVG continha? Nossos caminhos de cores salvos continham vários subcaminhos, portanto, um elemento de caminho SVG poderia conter vários contornos separados. O contador da interface não era a contagem de elementos do caminho XML ou uma contagem de peças artesanais significativas.

Remover o branco apenas recolorir o fundo? Não. PNGtoSVG descreve o controle × como removendo os caminhos dessa cor. Verifique qualquer arte branca, bem como o fundo externo antes de aceitar o resultado.

Essas marcas são marcas do sensor Cricut Print Then Cut? Este teste confirma quadrados de alinhamento correspondentes nos caminhos de cor exportados. Ele não verifica a compatibilidade com o fluxo de marcas de sensor da Cricut. Siga as instruções do aplicativo de destino e verifique a operação pretendida antes da produção.

Fontes

  1. PNGtoSVG — Vetorizador de imagem e FAQ — Remoção da paleta atual, descrição da marca de registro e interface real usada neste teste.
  2. W3C — SVG 2 caminhos — Vários subcaminhos podem pertencer a um elemento de caminho.
  3. W3C — SVG 2 sistemas de coordenadas — A distinção viewBox e região de coordenadas usada para descrever a exportação marcada.
  4. PerfectVector — Fatos sobre o produto — Visualização gratuita e limite de edição/exportação desbloqueado.

Comece gratuitamente com sua própria imagem no PerfectVector, depois inspecione suas cores, aberturas e menores pedaços antes de preparar um projeto em seu aplicativo de artesanato.

Mais do blog

PerfectVector

Prepare caminhos SVG limpos para
corte e produção

Vetorize e confira a visualização grátis, sem limite diário.