Tirar um tom específico de uma foto pra usar num design. Combinar uma cor de destaque UI com um asset de marca cujo hex você não tem. Extrair cores individuais de marca de uma imagem de logo, clique a clique. Construir uma paleta moodboard a partir de um fotograma ou peça de arte. Verificar que duas regiões de uma imagem são realmente a mesma cor (vs parecer iguais mas diferir nos pixels).

Anti-aliasing em texto. Letras têm bordas suaves que não representam a cor de "tinta" subjacente. Clique no meio de um traço grosso, não numa borda. Artefatos JPEG. Fotos muito comprimidas driftam em cor em regiões aparentemente chapadas. Se precisa de cor limpa, prefira fontes PNG. Imagem escalada pra exibição. Imagens muito grandes são reduzidas pra ~700px de largura. O pixel que você clica vem do canvas exibido, não do original. Pra extração pixel-perfect de um elemento minúsculo, recorte antes de subir. HSL é derivado, não armazenado. O browser guarda RGB; HSL é outra forma de descrever a mesma cor. Round-trips podem introduzir pequenos drifts por arredondamento.

Seletor de cor de imagem

Faça upload de uma imagem e clique em qualquer lugar pra obter hex, RGB e HSL daquele pixel. Construa uma paleta customizada clicando em vários pontos. Puro browser, sem upload.

Pick or drop an image (PNG, JPG, WebP)

🔒 Files never leave your browser — no upload, no server, no tracking.

Image (hover to magnify, click to pick)

No image yet.

Current pixel

HEX —

RGB —

HSL —

Locked palette

Click the image to lock colours into a custom palette.

Para que serve?

Esta ferramenta transforma qualquer imagem enviada numa fonte de cor clicável. Passe o mouse em qualquer ponto pra ler o pixel exato sob o cursor em hex, RGB e HSL — com uma lupa que amplia 8× pra você escolher pixels com precisão sem apertar os olhos. Clique pra travar uma cor numa paleta customizada: construa a paleta clicando vários pontos. Clique numa amostra da paleta pra removê-la. A imagem nunca sai do seu browser.

Quando usar

Tirar um tom específico de uma foto pra usar num design.
Combinar uma cor de destaque UI com um asset de marca cujo hex você não tem.
Extrair cores individuais de marca de uma imagem de logo, clique a clique.
Construir uma paleta moodboard a partir de um fotograma ou peça de arte.
Verificar que duas regiões de uma imagem são realmente a mesma cor (vs parecer iguais mas diferir nos pixels).

Como funciona a precisão

Sample de 1 pixel é exato mas barulhento — bordas anti-aliasadas, artefatos JPEG e renderização subpixel fazem vizinhos discordarem ligeiramente. A lupa 8× deixa você ver e clicar o pixel específico que quer, em vez de confiar na média. Pra extração de cor de marca importa; pra moodboards pode ignorar.

Cuidados comuns

Anti-aliasing em texto. Letras têm bordas suaves que não representam a cor de "tinta" subjacente. Clique no meio de um traço grosso, não numa borda.
Artefatos JPEG. Fotos muito comprimidas driftam em cor em regiões aparentemente chapadas. Se precisa de cor limpa, prefira fontes PNG.
Imagem escalada pra exibição. Imagens muito grandes são reduzidas pra ~700px de largura. O pixel que você clica vem do canvas exibido, não do original. Pra extração pixel-perfect de um elemento minúsculo, recorte antes de subir.
HSL é derivado, não armazenado. O browser guarda RGB; HSL é outra forma de descrever a mesma cor. Round-trips podem introduzir pequenos drifts por arredondamento.