Color Picker

Escolha cores e comece — sem complicação

Criamos o Color Picker em 2025 porque estávamos cansados de apps pesadas e ferramentas de cor complicadas demais. Como desenvolvedores front-end e ilustradores, precisávamos capturar uma cor rapidamente, ajustar um pouco e seguir em frente. Começou como ferramenta interna, virou a favorita do time; lapidamos e colocamos na web para todos. Sem conta e sem curva de aprendizado — abra a página, escolha um tom e copie os códigos HEX, RGB, HSL ou HSV.

Por que nosso seletor de cores agrada

Se você já olhou um design e pensou “como acerto exatamente aquele tom?”, vai gostar da simplicidade do Color Picker. Mantivemos a interface propositalmente minimalista:

• Um clique — e a cor é sua — toque em qualquer ponto da paleta e os valores necessários aparecem na hora. Precisa de uma amostra de uma foto ou captura de tela? Solte o arquivo na página e use o conta-gotas.
• Gradientes sem esforço — adicione e mova paradas na barra para criar transições sedosas. Alterne linear/radial, ajuste finamente ângulo e opacidade e copie o CSS.
• Sem limites, sem custos — o Color Picker funciona em qualquer navegador moderno no desktop, tablet ou celular. Nada para instalar e nenhuma taxa.
• Extensões quando precisar — nossas extensões opcionais para Chrome e Edge levam o conta-gotas direto ao navegador, para amostrar qualquer página e manter o histórico.

Para que serve

As pessoas usam o Color Picker de várias formas:

• Designers e times de produto usam ao rascunhar interfaces ou paletas de marca. Explorar combinações e copiar o CSS de gradientes é rapidinho.
• Ilustradores e artistas usam o conta-gotas para buscar inspiração em fotos e pinturas. A ferramenta de gradiente ajuda a planejar sombreamento suave e transições de cor.
• Desenvolvedores front-end confiam nela para gerar valores de cor consistentes entre projetos. A extensão facilita amostrar sites existentes.
• Quem verifica acessibilidade pode ver cores em diferentes modelos e ajustar a opacidade até atender às diretrizes de contraste.

Introdução

Sem manual — aqui vai um resumo rápido:

• Escolha uma cor — clique em qualquer lugar da paleta. Os valores HEX, RGB e HSV aparecem na hora. Ajuste matiz, saturação, brilho e opacidade pelos controles deslizantes.
• Amostre de uma imagem — arraste um arquivo de imagem para a página ou selecione um. Clique no pixel desejado para ver os códigos da cor.
• Crie um gradiente — clique na barra do gradiente para adicionar paradas e arraste; alterne entre linear e radial. Ajuste ângulo e opacidade até ficar perfeito.
• Copie e reutilize — suas cores e gradientes são salvos automaticamente. Copie os códigos ou o CSS e cole no projeto, ou compartilhe com a equipe.