Extraia a Cor de uma Imagem em um Clique
O Extrator de Cores de Imagem tira as cores predominantes de qualquer foto, captura de tela ou gráfico no momento em que você solta o arquivo. Envie uma imagem e a ferramenta monta uma paleta com os valores HEX, RGB e HSL de cada cor — sem chute, sem capturar pixel a pixel na mão.
Ela foi feita para designers em busca de inspiração em uma foto, desenvolvedores que precisam acertar a cor de uma marca e qualquer pessoa que queira o código exato de uma cor de uma imagem. Você também pode escolher qualquer pixel clicando direto na imagem e, depois, copiar ou exportar a paleta inteira para o seu projeto.
Como Extrair as Cores de uma Imagem
Adicione sua imagem
Clique na área de envio para procurar o arquivo, arraste e solte um arquivo sobre ela ou copie uma imagem e pressione Ctrl+V (Cmd+V no Mac) para colar. São aceitos arquivos PNG, JPG, GIF e WebP.
Veja a paleta
As cores predominantes aparecem na hora como cartões. Cada cartão mostra uma amostra, uma barra de predominância, o nome da cor mais próxima e os valores HEX, RGB e HSL lado a lado.
Escolha uma cor específica
Passe o cursor sobre a imagem para ver a cor sob ele e clique para capturar aquele pixel exato. Use o botão Ampliar para uma visão em tela cheia quando precisar de uma escolha precisa.
Ajuste e ordene
Use o controle deslizante para extrair de 3 a 15 cores, ordene a paleta por predominância, brilho ou matiz e clique em Extrair de novo para atualizar o resultado.
Copie ou exporte
Clique em qualquer valor para copiá-lo, use Copiar tudo para pegar todos os HEX de uma vez ou exporte a paleta como variáveis CSS, variáveis SCSS, JSON ou uma imagem PNG.
Recursos
Extração Inteligente de Cores
Um algoritmo de agrupamento k-means junta pixels parecidos para encontrar as cores realmente predominantes, e não só as mais frequentes, gerando paletas que combinam com a forma como você vê a imagem.
Seletor de Cores Interativo
Passe o cursor para ver a cor sob ele com uma dica de HEX ao vivo e clique para capturar qualquer pixel. O modo Ampliar oferece uma visão em tela cheia para uma escolha precisa.
Vários Formatos de Cor
Cada cor vem com os valores HEX, RGB e HSL, cada um com seu próprio botão de copiar em um clique, para você pegar o formato que o seu projeto precisar.
Nome das Cores
Cada cor é associada ao nome da cor mais próxima de um amplo banco de dados, deixando mais fácil descrever e lembrar dos tons da sua paleta.
Ordenação Flexível
Ordene a paleta por predominância para destacar as cores dominantes, por brilho do mais claro ao mais escuro ou por matiz para seguir o círculo cromático.
Quantidade de Cores Ajustável
Um controle deslizante simples permite extrair entre 3 e 15 cores, para você manter uma paleta enxuta ou capturar uma variedade maior de tons.
Opções de Exportação
Leve sua paleta para qualquer lugar como variáveis CSS, variáveis SCSS, dados JSON ou uma folha de amostras em PNG para baixar, com as etiquetas HEX.
Histórico de Paletas
Suas paletas recentes ficam salvas no navegador para você reabri-las sem enviar a imagem de novo. Limpe o histórico quando quiser para começar do zero.
Perguntas Frequentes
Como extrair as cores de uma imagem?
Adicione uma imagem clicando na área de envio, arrastando um arquivo para dentro dela ou colando da área de transferência. A ferramenta lê a foto e mostra as cores predominantes como uma paleta automaticamente — nada para instalar nem cadastro.
Como pego o código HEX de uma cor de uma foto?
Passe o cursor sobre o ponto desejado para ver a cor sob ele e clique para capturar aquele pixel exato. O valor HEX é copiado para você, e também dá para clicar em qualquer valor de um cartão de cor para copiá-lo.
Dá para pegar o RGB e o HEX juntos?
Sim. Cada cor extraída lista seus valores HEX, RGB e HSL juntos, e cada um tem seu próprio botão de copiar, para você pegar o formato que precisar.
Quais formatos de imagem são aceitos?
Arquivos PNG, JPG/JPEG, GIF e WebP funcionam. Para a paleta mais nítida, use uma imagem com cores bem definidas em vez de uma desfocada ou muito comprimida.
Quantas cores posso extrair?
De 3 a 15 cores, usando o controle deslizante. Ele começa em 3, o que serve para a maioria das imagens; aumente a quantidade para fotos com mais variedade e clique em Extrair de novo para refazer a paleta.
O que significa "predominância"?
A predominância mostra o quanto uma cor domina a imagem. Quanto mais cheia a barra de predominância de um cartão, maior a parte da foto coberta por aquela cor, o que ajuda a ver o equilíbrio geral de cores num relance.
Posso exportar a paleta como CSS ou JSON?
Sim. O menu de exportação permite copiar a paleta como propriedades personalizadas CSS ou variáveis SCSS, copiá-la como JSON para uso programático ou baixar uma folha de amostras em PNG. No caso do CSS, cole a exportação no seu :root e use valores como var(--color-1).
Minhas imagens são enviadas para um servidor?
Não. Todo o processamento roda no seu navegador com JavaScript, então suas imagens nunca saem do seu dispositivo. O histórico de paletas salvo também fica no armazenamento local do seu próprio navegador.
Funciona no celular?
Sim. O layout é responsivo e funciona em celulares e tablets. Em telas de toque, toque na imagem para escolher uma cor, em vez de passar o cursor com o mouse.
Ainda não há comentários. Seja o primeiro a comentar!