basetoolsTodas as ferramentas

Ferramentas de Cores online e grátis

Converter entre formatos de cor, checar contraste de acessibilidade, extrair paleta de uma imagem e montar gradiente CSS — ferramentas de cor para quem projeta e desenvolve interface.

Cor no navegador aparece em vários formatos ao mesmo tempo — HEX para CSS e design, RGB para quem pensa em canais de luz, HSL e HSB/HSV para quem ajusta matiz e saturação de forma mais intuitiva, CMYK para quem prepara arquivo para impressão — e raramente a ferramenta que você está usando aceita o formato que você tem em mãos. O conversor de cores resolve isso mostrando todos ao mesmo tempo, a partir de um único valor de entrada, com cada formato pronto para copiar.

Contraste de cores existe por um motivo concreto: a Web Content Accessibility Guidelines (WCAG) define proporções mínimas de contraste entre texto e fundo — 4.5:1 para texto normal, 3:1 para texto grande, no nível AA, que é o padrão de referência mais usado — e essas proporções não são perceptíveis a olho nu com confiabilidade, principalmente em tons de saturação e luminosidade parecidas. A ferramenta calcula a razão real entre duas cores e diz se ela passa em AA, AAA, ou nenhum dos dois, para cada tamanho de texto. Isso importa não só por acessibilidade formal: contraste insuficiente é o motivo mais comum de reclamação de "não consigo ler esse texto", mesmo de quem não tem nenhuma deficiência visual diagnosticada.

Extrair cores de imagem lê os pixels reais de uma imagem e devolve as cores predominantes que realmente aparecem nela — diferente de adivinhar uma paleta "parecida", ela calcula a partir do arquivo enviado, então o resultado é específico daquela imagem, não uma aproximação genérica. Útil para pegar a paleta de uma foto de referência, de um logotipo ou de uma captura de tela e aplicar em outro lugar. Paleta de cores faz o caminho inverso: a partir de uma única cor base, gera uma paleta inteira seguindo um esquema definido (complementar, análoga, tríade, tétrade ou monocromática) — esquemas que vêm da teoria de cores tradicional, cada um pensado para um tipo de resultado visual diferente (contraste forte, harmonia suave, variação dentro do mesmo tom).

Gradiente CSS é a única puramente de código, não de cor isolada: monta um gradiente linear, radial ou cônico a partir das paradas de cor que você define, com prévia ao vivo, e devolve o valor de background pronto para colar. As cinco ferramentas desta categoria trabalham só com número e pixel — nenhuma delas lê nem guarda nenhuma outra informação da imagem que você eventualmente carregar para extrair cor dela.