Qual é a diferença entre a paleta e o conta-gotas?

A paleta mostra as 6 cores mais dominantes de toda a imagem — bom para extrair um sistema de design de uma foto. O conta-gotas permite escolher um pixel exato — bom para igualar um tom específico, verificar um valor hex ou amostrar um único elemento.

Por que imagens grandes são reduzidas?

A análise de pixels em uma foto de 12MP exigiria ler 12 milhões de pixels — lento e pesado em memória. Reduzir para 1.600px no lado maior reduz isso para ~1,5 milhão de pixels sem perda visível de precisão para extração de paleta. O conta-gotas ainda lê do buffer reduzido, então as coordenadas de pixel se referem a isso.

Qual é o formato da exportação CSS?

A saída é um bloco :root com propriedades personalizadas numeradas, pronto para colar em qualquer folha de estilos. Exemplo: `:root { --color-1: #FF5733; /* laranja */ --color-2: #C70039; /* vermelho escuro */ ... }`. Cada propriedade inclui o nome de cor auto-detectado como comentário.

Os nomes das cores são precisos?

Os nomes vêm de uma heurística de balde de matiz HSL (vermelho, laranja, amarelo, verde, ciano, azul, violeta, rosa, mais variantes claras/escuras). São aproximações, não correspondências com bancos de dados de cores nomeadas. Para uma cor 'nomeada' como 'coral' ou 'turquesa', espere o nome de balde mais próximo em vez disso.

A ferramenta suporta imagens transparentes?

Sim. Pixels totalmente transparentes são ignorados durante a extração de paleta. Pixels semitransparentes são misturados com branco antes da amostragem — isso reflete como a cor se parece quando exibida sobre um fundo branco típico.

Minha imagem é enviada para algum lugar?

Não. Tudo acontece na hora. Sua imagem é decodificada em memória, analisada e descartada — nada sai do seu dispositivo.

Posso escolher cores no celular?

Sim. O conta-gotas funciona com toque — toque e arraste para mover a lupa, levante o dedo para confirmar a cor nesse ponto. Para apontar com precisão a pixels em telas pequenas, amplie o navegador ou use uma imagem de origem maior.

Ad Slot — Header Banner

Conta-gotas + Paleta Automática · 100% Privado

Paleta de Cores de Imagem e Extrator HEX

Envie qualquer foto para extrair sua paleta de cores dominante e escolher valores HEX, RGB ou HSL precisos com um conta-gotas interativo. Copie códigos individuais, ou baixe a paleta inteira como variáveis CSS. Tudo acontece na hora — sem uploads.

#HEX#RGB#HSL#Paleta#CSS#Conta-gotas

Solte uma imagem ou clique para procurar

PNG, JPG, WebP, AVIF, GIF · Arquivo único · Analisado na hora

Envie uma imagem para extrair sua paleta

PNG, JPG, WebP, AVIF ou GIF. O conta-gotas dá precisão ao nível de pixel; a paleta mostra as 6 cores mais dominantes.

Ad Slot — Below the Fold

Como extrair cores de uma imagem em 3 passos

Paleta dominante + conta-gotas ao nível de pixel.

Envie sua imagem

Solte um PNG, JPG, WebP, AVIF ou GIF. A ferramenta a reduz internamente por velocidade, depois executa um quantizador de corte mediano para encontrar as 6 cores mais dominantes.

Selecione pixels específicos

Passe o mouse sobre a imagem para ativar a lupa ampliadora. Ela amplia 12× para que você possa apontar para pixels individuais. Clique em qualquer ponto para fixar essa cor no cartão de cor selecionada.

Copie códigos ou exporte CSS

Cada amostra mostra HEX, RGB e HSL — clique em qualquer linha para copiar. Use o botão Copiar CSS para obter variáveis :root prontas para colar em uma folha de estilos, ou Baixar CSS para um arquivo .css.

Perguntas Frequentes

Ela usa quantização de corte mediano — um algoritmo clássico que divide recursivamente o espaço de cor ao longo de seu eixo mais longo na mediana, depois calcula a média de cada região resultante. Isso produz uma paleta que reflete a distribuição real de cor da imagem melhor que a amostragem de histograma ingênua.

Sobre a Paleta de Cores de Imagem e Extrator HEX

Everything you need to know

Por que extrair paletas de imagens?

Designers, desenvolvedores e profissionais de marketing frequentemente precisam igualar cores de um ativo de marca, uma fotografia ou a interface de um concorrente. A seleção manual de cores é tediosa e propensa a erros. Esta ferramenta automatiza a descoberta de cores dominantes e fornece amostragem ao nível de pixel para trabalho de precisão — tudo em uma interface. Use-a para construir um sistema de design a partir de um mood board, extrair cores de marca de um logo, ou tirar uma paleta coerente de uma foto de paisagem.

Entendendo os formatos de cor

HEX é o padrão para web e ferramentas de design — seis dígitos hexadecimais representando vermelho, verde e azul (ex. #FF5733). RGB expressa os mesmos valores como triplas decimais (255, 87, 51) — melhor para uso programático. HSL descreve matiz, saturação e luminosidade em termos legíveis por humanos (11°, 100%, 60%) — melhor para construir variações como '20% mais escuro' ou 'mais saturado'. Cada amostra mostra os três, e qualquer linha é um clique para copiar.

Quantização de corte mediano explicada

O corte mediano é um algoritmo clássico de 1980 que reduz milhões de cores a um pequeno conjunto representativo. Funciona dividindo repetidamente o espaço de cor ao longo de sua dimensão mais longa, partindo os pixels no valor mediano. Após N divisões você tem N regiões; a média de cada região se torna uma cor da paleta. Isso produz paletas perceptualmente equilibradas — ao contrário do k-means ingênuo, que pode ficar preso em mínimos locais, ou abordagens de histograma, que favorecem clusters visualmente similares.

Privacidade, desempenho e compatibilidade com navegadores

Tudo roda no seu dispositivo — sua imagem nunca sai do seu navegador. A extração de paleta em uma foto típica de 4MP leva 100–300ms. O conta-gotas lê diretamente do buffer de pixels em memória sem latência perceptível. A ferramenta funciona em todos os navegadores modernos (Chrome, Firefox, Safari, Edge) e permanece funcional offline após a primeira carga.