Extrair cores de uma foto

Como as cores dominantes são escolhidas

A ferramenta analisa os pixels de uma cópia reduzida da sua imagem e os agrupa em famílias de tons parecidos (uma técnica chamada quantização). As maiores famílias formam a paleta e, no processo, os tons quase idênticos são descartados. O resultado são 6 a 8 cores que representam de verdade a foto, e não médias desbotadas que tendem todas para o cinza. É o mesmo princípio que as ferramentas de design usam para criar paletas a partir de moodboards e fotografias.

O que você pode fazer com uma paleta tirada de uma foto

Partir das cores de uma foto é a forma mais rápida de manter seus designs coerentes: uma miniatura de vídeo que combina com o quadro da capa, uma landing page com as cores do seu produto, uma apresentação que harmoniza com as imagens que ela contém. Cada código HEX (por exemplo, #FF8A5C) pode ser colado direto no Canva, no Figma, no Photoshop, no PowerPoint ou no CSS do seu site.

O que significa “cor dominante”

Não é a cor que mais chama a atenção, é a que ocupa mais pixels. São duas coisas diferentes, e essa diferença explica quase todas as paletas que parecem erradas: numa foto de pôr do sol, a cor dominante pode ser o cinza da estrada, porque a estrada ocupa metade da imagem, enquanto o laranja que salta aos olhos está numa faixa estreita.

O método agrupa os pixels em famílias de tons parecidos e pega as famílias mais numerosas: isso se chama quantização. Por isso, um fundo grande e uniforme quase sempre vence, e recortar a foto na parte que interessa muda o resultado por completo.

Como usar uma paleta extraída

A regra mais útil do design gráfico é a regra 60-30-10: uma cor domina a superfície, outra a acompanha e uma terceira aparece só em toques de destaque, como um botão, um título ou um detalhe. Tirar quatro cores de uma foto e usá-las em partes iguais quase sempre dá um resultado confuso.

O segundo critério é o contraste do texto: uma cor que fica linda na tela não garante que um texto em cima dela seja legível. Texto escuro sobre fundo claro, ou o contrário, precisa ser conferido, e para a acessibilidade a relação de contraste recomendada é de pelo menos 4,5 para 1 em texto normal. Muitas paletas naturais são só de tons médios, e nesse caso é preciso trazer de fora uma cor bem escura ou bem clara.

Por que duas ferramentas dão paletas diferentes

Porque a palavra “parecido” não tem uma definição única. Algumas agrupam as cores no espaço RGB, ou seja, pelos números, outras em espaços construídos sobre a percepção, em que duas cores próximas são as que o olho considera próximas. As segundas dão resultados mais convincentes em tons de pele e em verdes, onde o RGB erra bastante.

Contam também o número de famílias pedidas e o fato de a imagem ser reduzida antes de ser analisada, algo que todas fazem por velocidade e que mistura as cores vizinhas. Não existe, portanto, uma paleta “correta” de uma foto: existem paletas plausíveis, e convém escolher uma e depois ajustá-la à mão.

As três armadilhas da cor tirada de uma foto

O perfil de cor: uma foto em Adobe RGB lida como sRGB gera códigos hexadecimais errados, e as cores saem apagadas. A compressão: num JPEG muito comprimido, as cores perto das bordas são inventadas pelo algoritmo, e escolher uma cor bem ali devolve um tom que nunca esteve na cena.

E a impressão: as cores da tela são luz, as da impressão são tinta, e laranjas e verdes muito saturados não existem na impressão. Uma paleta escolhida na tela para um cartão de visita deve sempre ser testada no papel antes de mandar imprimir mil cópias.

Veja também

Para trabalhar com cores, há o Conversor de cores e o Gerador de paletas. Para mexer na imagem de origem, Foto em preto e branco e Redimensionar imagem, e para transformá-la num fundo desfocado, Desfocar foto.