Extrair cores da imagem: envie a foto e receba as cores dominantes em HEX e RGB, com o bloco de variáveis CSS pronto para colar no projeto. Clique em qualquer amostra para copiar o código dela.
Como extrair a paleta
- Arraste a imagem ou clique em Escolher imagem.
- Escolha quantas cores quer. Cinco ou seis dão uma paleta usável; doze servem quando você quer explorar variações de uma foto cheia de tons.
- Clique em Extrair paleta. Cada amostra mostra o HEX e o RGB.
- Clique numa amostra para copiar o código, ou use Copiar CSS para levar a paleta inteira como variáveis.
Como as cores são escolhidas
A ferramenta reduz a imagem, agrupa os pixels em faixas de cor e fica com as mais frequentes. Sobre isso roda um filtro de diversidade, que evita o problema clássico dessas paletas: voltar cinco tons de azul quase idênticos só porque o céu ocupa metade da foto.
O resultado é a cor que está de fato ali, não uma sugestão de harmonia. Se a foto tem dominância amarelada de lâmpada, a paleta vai vir amarelada também. Corrigir a imagem antes no ajustar foto muda bastante o que sai daqui.
Para que serve a paleta
O uso mais comum é montar identidade visual a partir de uma foto: pegar as cores de uma imagem de produto e aplicar em slide, post e site para tudo conversar entre si.
Em desenvolvimento, o bloco de CSS entra direto no projeto como variáveis e poupa o vai e volta com o conta-gotas. Para material de marca oficial, use isto como ponto de partida e confira o manual, porque cor de marca costuma ter valor exato definido, e uma foto sempre distorce um pouco.
Serve para logo e identidade de marca?
Como ponto de partida, sim. Para marca oficial, confira o manual: a cor definida lá é a que vale, e qualquer foto muda um pouco o tom por causa de iluminação e compressão.
Como copio uma cor sozinha?
Clique na amostra e o HEX vai para a área de transferência. O botão Copiar CSS leva a paleta inteira de uma vez.
Dá para pegar a cor de um ponto específico?
Não. Aqui a análise é da imagem toda e devolve as cores dominantes. Para um ponto exato, recorte antes só aquela região no recortar imagem e extraia da parte recortada.
Quantas cores pedir?
Quatro ou cinco para uma paleta enxuta de identidade visual. Oito a doze quando você quer mapear os tons de uma foto complexa e escolher depois.
As cores saem diferentes do que vejo na tela
Pode acontecer. Tela com perfil de cor diferente e imagem com dados de perfil embutidos mostram o mesmo pixel de formas distintas. O valor que sai aqui é o do pixel no arquivo.
Funciona com PNG transparente?
Funciona. Áreas vazadas não entram na conta, então a paleta vem só do que está desenhado.
Serve para logo e brand?
Sim, como ponto de partida. Para marcas oficiais, confira o manual da marca; aqui o foco é inspirações e extrair tons de fotos de produto.
