Desenvolvedor / Cores SVG
Alterador de cores SVG: recolora e copie SVG
Inspecione cores SVG explícitas e suas contagens de uso, edite paradas de gradiente e regras CSS simples de pintura e baixe o SVG ou copie o código.
Alterador de cores SVG: recolora e copie SVG: Encontra tokens de pintura explícitos nos atributos fill, stroke, stop-color, color, flood-color e lighting-color, em estilos inline e em regras de estilo simples. Cores nomeadas, hexadecimais curtas, rgb() e hsl() são normalizadas. As substituições preservam os demais bytes da origem quando a sanitização não exige alterações. Roda 100% localmente no seu navegador, sem enviar nenhum arquivo para o servidor.
- Categoria
- Ferramentas para desenvolvedores
- Execuções
- No seu navegador
- Custo
- Grátis · sem cadastro
- Disponibilidade
- Pronto para usar
Roda inteiramente no seu navegador
Pintura SVG
fill, stroke e paradas de gradiente do SVG usam valores de cor e referências a servidores de pintura. Especificação: https://www.w3.org/TR/SVG2/painting.html
Sintaxe de cores
O analisador aceita cores nomeadas, hex, rgb(), hsl() e currentColor. O canal alfa é preservado quando fornecido. Variáveis CSS e espaços de cores avançados estão fora do escopo do analisador desta ferramenta. Especificação: https://www.w3.org/TR/css-color-4/
Como usar
- Solte um SVG ou cole a marcação.
- Use cada seletor de cores ou insira uma substituição; opcionalmente, recolora todos os tokens de uma vez.
- Compare o antes e o depois e baixe ou copie o SVG sanitizado.
Privacidade e limitações
O código SVG permanece no seu navegador. As prévias são imagens isoladas, e conteúdos inseguros e recursos externos são removidos.
Ferramentas relacionadas
Perguntas frequentes
O que a contagem de uso contabiliza?
Tokens de cor explícitos na marcação, não o número de pixels renderizados nem de elementos que recebem um estilo herdado.
Gradientes são compatíveis?
Sim. As cores das paradas de gradiente podem ser alteradas sem substituir IDs ou referências de gradientes.
O que currentColor faz?
Ele usa o valor de CSS color herdado quando o SVG é incorporado inline. Uma prévia de imagem normalmente usa preto, a menos que o próprio SVG defina color.
Todas as cores CSS são resolvidas?
Não. Variáveis CSS, espaços de cores avançados, padrões herdados e resultados calculados de seletores não são resolvidos. Declarações e seletores simples são compatíveis.
Ferramenta grátis · no seu navegador execuções · não precisa de conta