🎨 Extrator de paleta de cores ☆

Extraia uma paleta de cores de qualquer imagem

Extrator de Paleta de Cores Grátis analisa uma foto ou design e extrai as cores dominantes. Solte uma imagem, receba uma paleta instantânea ordenada por frequência e copie o valor HEX, RGB ou HSL de cada cor com um clique.

O que você recebe

• Cores dominantes ordenadas por cobertura de pixels
• Valores HEX, RGB e HSL para cada amostra
• Cópia em um clique para ferramentas de design e CSS

Usos comuns

• Criar uma paleta de marca a partir de um logo ou foto
• Alinhar cores de interface a uma imagem de referência
• Escolher cores de impressão ou tinta a partir de uma foto

A análise roda no navegador sobre uma cópia reduzida em canvas, a imagem em resolução total nunca sai do seu dispositivo.

Como funciona a extração de paletas

A imagem é desenhada num canvas pequeno, os pixels são quantizados em grupos de cor, e as cores mais representativas são ordenadas por frequência e distância visual. O resultado reflete o que o olho vê, em vez de uma lista alfabética de cada tom. Cada amostra pode ser copiada como HEX, RGB ou HSL para colar em CSS, ferramentas de design ou especificações de impressão.

Capacidades e restrições

Privacidade: imagens são analisadas localmente

Moodboards, mockups de clientes e fotos de produto costumam ser confidenciais: a imagem é lida localmente e só uma cópia reduzida é processada em memória. Nada é transmitido ou armazenado.

Construir paletas utilizáveis

• Comece de uma imagem limpa e contrastada.
• Trate a lista como ponto de partida e ajuste o contraste de acessibilidade.
• Mantenha 4-6 cores para uma paleta de marca.
• Copie HEX para telas e conversões CMYK para impressão.
• Reexecute após editar a imagem.

Veja também todas as ferramentas de imagem para seletor de cor, compressão e conversão.

Teoria das cores: dominância, contraste e combinações acessíveis

Uma paleta extraída é mais útil quando você sabe qual papel cada cor desempenha. A maioria das imagens rende uma ou duas cores dominantes que cobrem a maior área, vários tons secundários e poucos acentos muito saturados. Agrupar assim torna o design coerente: use um tom dominante para grandes superfícies, um secundário para cartões e bordas, e reserve acentos para botões e links. O contraste decide a legibilidade. As diretrizes WCAG pedem proporção de contraste de pelo menos 4,5:1 para texto normal e 3:1 para texto grande; duas cores que parecem diferentes na tela ainda podem falhar porque a proporção é regida pelo brilho percebido, não pelo matiz. O extrator informa os valores necessários para checar esse par, e trocar um acento claro por um tom mais escuro do mesmo matiz costuma bastar. Lembre-se de que cor não é o único canal: nunca codifique significado só pelo matiz, pois cerca de um em cada doze homens tem alguma forma de deficiência de visão de cores. Fotografias também carregam humor, paletas quentes parecem energéticas e dessaturadas, calmas, então colha a amostra de uma imagem que combine com a mensagem, não do primeiro resultado. A extração roda no seu navegador, então artes de clientes e fotos de produto não publicadas permanecem privadas.