Ferramentas SVG

Cores SVG

Identifique as cores do SVG e substitua todas as ocorrências de uma cor para dar um novo aspeto a ícones e ilustrações.

O conteúdo SVG é processado apenas no seu navegador e não é enviado para um servidor.

Sobre esta ferramenta

Esta ferramenta permite mudar as cores de ícones, logótipos e ilustrações. Apresenta as declarações de cor mais comuns e o número de ocorrências. Escolha as novas cores, confira a pré-visualização estática e descarregue o SVG alterado.

Como utilizar

  1. Escolha um ficheiro SVG ou cole o código e clique em Ler cores.
  2. Consulte cada cor, a amostra e o número de ocorrências. Defina as cores de substituição pretendidas.
  3. Aplique as alterações e verifique os preenchimentos, os contornos e os gradientes.
  4. Confirme a combinação de cores e copie ou descarregue edited-colors.svg.

Funcionalidades

  • Identifica cores comuns em fill, stroke, stop-color, flood-color e lighting-color.
  • Suporta valores hexadecimais, rgb, rgba e nomes de cores comuns em atributos e declarações de estilo habituais.
  • Altera apenas declarações de cor. Texto, IDs e ligações com as mesmas palavras não são tratados como cores.

Valores que não são substituídos como cores simples

  • none indica ausência de pintura; currentColor utiliza a cor atual do texto; url(#gradient) referencia um gradiente ou padrão interno. Estes valores não são substituídos como cores simples.
  • Para alterar gradientes, ajuste as cores de cada ponto de paragem. A lista pode não representar todo o resultado visual quando as cores dependem de herança complexa ou estilos não suportados.
  • O ficheiro principal preserva o conteúdo não alterado, incluindo comentários e metadados, e pode manter scripts ou referências externas. A pré-visualização filtra esse conteúdo; também pode descarregar uma versão SVG filtrada em separado.

Segurança dos ficheiros SVG

A pré-visualização utiliza uma cópia estática filtrada: não executa scripts, eventos de clique ou animações, nem carrega imagens, tipos de letra ou estilos externos. Referências externas, páginas incorporadas e conteúdo não suportado são removidos, pelo que a imagem pode diferir do original. Documentos com DOCTYPE ou entidades personalizadas não são suportados.

O ficheiro SVG ou código UTF-8 pode ter até 2 MiB, 20000 nós (incluindo elementos e texto) e 96 níveis de profundidade. Se o conteúdo for demasiado grande ou complexo, simplifique primeiro o ficheiro.

Privacidade

O conteúdo SVG é processado apenas no seu navegador e não é enviado para um servidor.

A ferramenta não guarda automaticamente o conteúdo nem os resultados. Descarregue o que pretende conservar antes de limpar ou sair da página e mantenha uma cópia do original.

Perguntas frequentes

Porque não posso alterar diretamente algumas cores?

Algumas cores resultam de herança, da cor atual do texto, de gradientes ou de estilos complexos. Podem não corresponder a uma cor fixa substituível. Consulte primeiro a lista e a pré-visualização.

O que é currentColor?

Indica que deve ser utilizada a cor atual do texto, em vez de uma cor hexadecimal fixa. Por isso, não é substituído como uma cor simples.

Porque é que url(#gradient) não é uma cor simples?

É uma referência a um gradiente ou padrão definido dentro do SVG. Para mudar as suas cores, ajuste os pontos de cor desse gradiente.

Alterar cores muda a estrutura do SVG?

As alterações afetam as declarações de cor e não convertem os caminhos em píxeis. O ficheiro principal conserva o restante conteúdo; a versão filtrada remove conteúdo ativo não suportado e referências externas.

Voltar ao diretório de ferramentas para programadores