Todo designer e desenvolvedor enfrenta estes obstáculos ao mudar de formato de cor.
Ferramentas de design exportam em HEX, CSS espera HSL e a impressão exige CMYK. Sem um conversor de cores confiável você acaba adivinhando ou saltando de site em site, desperdiçando tempo valioso.
Converter RGB para HSL manualmente requer trigonometria. Um único erro de digitação na fórmula vira o seu matiz 180°. Color Math realiza todos os cálculos de forma instantânea e sem erros.
A maioria dos seletores de cor ignora os requisitos de contraste WCAG 2.1. Color Math exibe os rácios de contraste imediatamente para que a acessibilidade seja integrada desde o primeiro clique.
Pré-visualização de cor
#3B82F6
rgb(59, 130, 246)
Current
Complementar
Análoga
Triádica
Clique em um tom para carregá-lo
White text on color
Black text on color
As cores salvas aparecem aqui
Um único conversor de cores para todos os sistemas. Color Math substitui várias ferramentas de uma só vez.
Edite qualquer campo — HEX, RGB, HSL ou CMYK — e o Color Math recalcula instantaneamente todos os outros formatos. Não é necessário confirmar.
Arraste os controlos deslizantes R, G, B, H, S, L, C, M, Y, K e veja todos os formatos atualizarem-se em tempo real. Ideal para afinar tons sem usar o teclado.
Color Math gera paletas complementares, análogas e triádicas a partir da sua cor. Clique em qualquer tom para carregá-lo imediatamente.
Veja de relance os rácios de contraste sobre fundo branco e preto. Color Math indica AA, AAA ou Reprovado para um design acessível por defeito.
Cada cor salva persiste no seu navegador entre sessões. Color Math conserva até 10 cores recentes para rever e comparar quando quiser.
Todos os cálculos do Color Math são executados completamente no seu navegador. Nenhum dado é transmitido, nenhuma conta necessária — as suas cores são só suas.
Desde a ligação entre design e código até à impressão e acessibilidade — Color Math adapta-se a cada etapa do seu fluxo de trabalho com cores.
Obteve um HEX no Figma? Cole-o no Color Math e obtenha imediatamente o equivalente HSL para as suas propriedades CSS personalizadas. Ajuste a luminosidade para estados hover e focus sem reabrir o ficheiro de design.
Color Math converte o seu RGB de ecrã em valores CMYK teóricos para detetar vermelhos e laranjas fora da gama antes de enviar para a gráfica. Antecipe surpresas desagradáveis sem custos adicionais.
Color Math calcula os rácios de contraste WCAG 2.1 relativamente ao branco e ao preto em tempo real. Saiba imediatamente se a cor do seu texto cumpre os níveis AA ou AAA — sem ferramenta adicional.
Três passos para converter, explorar e guardar qualquer cor.
Escreva um código HEX (as abreviações como #f00 expandem-se automaticamente) ou arraste um controlo deslizante para começar. Color Math aceita entradas HEX, RGB, HSL e CMYK em simultâneo.
Mude entre os separadores RGB, HSL e CMYK para ajustar com os controlos deslizantes. Role até ao painel de Paleta para ver as cores complementares, análogas e triádicas geradas pelo Color Math.
Clique num botão Copiar para obter o formato pretendido. Prima Guardar para adicionar o tom atual ao histórico. Color Math conserva até 10 cores entre sessões.
Respostas às perguntas mais comuns sobre Color Math e conversão de cores.
Color Math é um conversor de cores gratuito e baseado no navegador que transforma códigos HEX, RGB, HSL e CMYK em tempo real. Também gera paletas de cores (complementar, análoga, triádica) e calcula rácios de contraste WCAG 2.1 — tudo sem pedidos ao servidor.
Color Math usa uma fórmula matemática padrão (RGB → CMYK) que fornece uma boa estimativa teórica. No entanto, a saída de impressão real depende da impressora, tintas, papel e perfil ICC. Use o Color Math como referência, não como substituto para a gestão profissional de cores de impressão.
O WCAG 2.1 define rácios mínimos de contraste para a legibilidade do texto. AA exige 4,5:1 para texto normal e 3:1 para texto grande. AAA exige 7:1 para texto normal. Color Math calcula estes rácios relativamente ao branco puro e ao preto puro para ajudá-lo a escolher o fundo adequado.
HSL (Matiz, Saturação, Luminosidade) corresponde melhor à forma como o CSS define cores e como os designers pensam em tons claros e sombras. Uma Luminosidade de 50% em HSL dá a versão mais pura de um matiz, facilitando a geração de variantes mais claras ou mais escuras ajustando um único valor.
Color Math guarda as suas cores apenas no localStorage do seu navegador — nunca num servidor. O histórico é local ao seu dispositivo e perfil de navegador. Limpar os dados do navegador eliminará este histórico.
Color Math calcula as cores da paleta usando a teoria das cores HSL. As cores complementares estão a 180° na roda de cores. As análogas estão a ±30°. As triádicas estão a +120° e +240°. A saturação e a luminosidade permanecem idênticas às da cor de origem para uma paleta visualmente coerente.
Sim. Color Math é totalmente responsivo. Os controlos deslizantes, campos de entrada e a grelha de paletas adaptam-se a ecrãs pequenos. Todos os cálculos são locais, pelo que não há latência em redes móveis.
Sem registo. Funciona offline após o primeiro carregamento.
