Color Picker

Escolha cores e avance — sem complicações

Criámos o Color Picker em 2025 porque estávamos fartos de apps pesadas e ferramentas de cor demasiado complexas. Enquanto programadores front-end e ilustradores, precisávamos de captar rapidamente uma cor, ajustá-la um pouco e seguir em frente. Começou como ferramenta interna, tornou-se a favorita da equipa; aperfeiçoámo-la e colocámo-la na web para todos. Sem conta e sem curva de aprendizagem — abra a página, escolha um tom e copie os códigos HEX, RGB, HSL ou HSV.

Porque é que o nosso seletor agrada

Se alguma vez olhou para um design e pensou “como acerto exatamente aquele tom?”, vai apreciar a simplicidade do Color Picker. Mantivemos a interface propositadamente minimalista:

• Um clique — e a cor é sua — toque em qualquer ponto da paleta e os valores necessários aparecem de imediato. Precisa de uma amostra de uma foto ou captura de ecrã? Largue o ficheiro na página e use o conta-gotas.
• Gradientes sem esforço — adicione e mova paragens na barra para criar transições sedosas. Alterne linear/radial, ajuste finamente o ângulo e a opacidade e copie o CSS.
• Sem limites, sem custos — o Color Picker funciona em qualquer navegador moderno no computador, tablet ou telemóvel. Nada para instalar e sem taxas.
• Extensões quando precisar — as nossas extensões opcionais para Chrome e Edge levam o conta-gotas diretamente 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 equipas de produto usam-no ao esboçar interfaces ou paletas de marca. Explorar combinações e copiar o CSS de gradientes é rápido.
• Ilustradores e artistas usam o conta-gotas para se inspirarem em fotos e pinturas. A ferramenta de gradiente ajuda a planear sombreamento suave e transições de cor.
• Programadores front-end confiam na ferramenta para gerar valores de cor consistentes em vários projetos. A extensão facilita amostrar sites existentes.
• Quem verifica a acessibilidade pode ver cores em diferentes modelos e ajustar a opacidade até cumprir as diretrizes de contraste.

Introdução

Dispensa manual — aqui vai um resumo rápido:

• Escolha uma cor — clique em qualquer ponto da paleta. Os valores HEX, RGB e HSV aparecem de imediato. Ajuste matiz, saturação, brilho e opacidade com os cursores.
• Amostre de uma imagem — arraste um ficheiro de imagem para a página ou selecione um. Clique no pixel pretendido para ver os códigos da cor.
• Crie um gradiente — clique na barra do gradiente para adicionar paragens e arraste-as; alterne entre linear e radial. Ajuste o ângulo e a opacidade até ficar perfeito.
• Copiar e reutilizar — as suas cores e gradientes são guardados automaticamente. Copie os códigos ou o CSS e cole no projeto, ou partilhe com a equipa.