Paleta de cores da imagem

Largue uma imagem e obtenha as cores principais em HEX, RGB, HSL e OKLCH, ordenadas pela parte da imagem que ocupam – ou clique em qualquer ponto para escolher uma cor.

Sobre esta ferramenta

As cores da sua imagem, prontas para código e design

Cores de marca de um logótipo, um moodboard de uma foto ou o tom exato de um píxel – calculados no seu navegador.

Cores dominantes e a sua percentagem

De 3 a 16 cores, agrupadas no espaço percetual OKLab para que tons parecidos se juntem como o olho os vê. Cada uma mostra quanto da imagem ocupa, e a mesma imagem dá sempre a mesma paleta.

Todos os formatos, com contraste

HEX, RGB, HSL e OKLCH, cada um com botão de copiar, mais a relação de contraste WCAG sobre branco e sobre preto e se cumpre AA ou AAA para texto.

Exportar para qualquer lado

Variáveis CSS, tema Tailwind, variáveis SCSS e JSON para código; Adobe Swatch Exchange (.ase) para Photoshop e Illustrator; paleta .gpl para GIMP, Inkscape e Krita; e um cartão de paleta PNG para partilhar.

Como funciona

  1. Largue uma foto, captura ou logótipo (PNG, JPG, WebP, HEIC ou SVG), ou cole-o com Ctrl + V.
  2. Defina quantas cores quer com o controlo «Cores». A paleta atualiza-se de imediato.
  3. Clique em qualquer ponto da imagem para juntar essa cor exata em «Cores escolhidas».
  4. Copie valores individuais, ou escolha um formato de exportação e copie-o ou transfira-o – ou guarde o «Cartão da paleta (PNG)».

Perguntas frequentes

As minhas imagens são enviadas para um servidor?

Não. Cada imagem é lida, processada e guardada no separador do seu navegador com Canvas, Web Workers e WebAssembly. Nada é enviado, armazenado ou registado.

Como são encontradas as cores dominantes?

A imagem é reduzida a 256 px, os píxeis são agrupados por cor e um agrupamento k-means no espaço OKLab encontra o número de cores pedido. Os píxeis transparentes são ignorados; a percentagem é a parte da imagem visível mais próxima de cada cor.

O que significa a relação de contraste?

É o contraste WCAG 2 entre a cor e texto branco ou preto. 4,5:1 cumpre AA para texto normal, 3:1 cumpre AA para texto grande (24 px, ou 19 px em negrito) e 7:1 cumpre AAA.

Posso abrir a paleta no Photoshop ou no GIMP?

Sim. O ficheiro .ase abre no painel Amostras do Photoshop, Illustrator e InDesign; o ficheiro .gpl no GIMP, Inkscape e Krita.

É gratuito? Fica com marca de água?

Sim, pode usá-lo gratuitamente sem conta, e o Toolula nunca acrescenta marca de água. O plano gratuito tem limites de utilização razoável; o Toolula Pro, um plano opcional, aumenta-os.