Escolha uma cor, leve o código e volte ao trabalho
Seletor de cores, criador de gradientes e conta-gotas de imagens numa só página. Sem conta, sem instalação e sem espera: escolha um tom e copie-o como HEX, RGB, HSL ou HSV.
Códigos de cor
#0F37FFrgb(15, 55, 255)hsl(230°, 100%, 52.94%)hsv(230°, 94.12%, 100%)cmyk(94.12%, 78.43%, 0%, 0%)xyz(19.61, 10.05, 95.5)lab(37.93, 62.96, -98.45)lch(37.93, 116.86, 302.6°)Cores em tendência
Ver todas as cores em tendênciaO que tem cá dentro
Conta-gotas
Capte cores de uma imagem carregada, ou de qualquer coisa no ecrã onde o navegador o permita. Largue um ficheiro na página e clique num píxel.
Conversão de formatos
Alterne de imediato entre HEX, RGB, HSL, HSV, CMYK, XYZ, LAB e LCH e copie qualquer valor diretamente para CSS ou para a sua ferramenta de design.
Criador de gradientes
Adicione e arraste paragens na barra, alterne entre linear e radial, ajuste o ângulo e a opacidade e copie o CSS final.
Histórico de cores
Cada cor e gradiente fica guardado no seu navegador, para voltar mais tarde ou reaproveitar noutro projeto.
Harmonias e variações
Cada página de cor mostra tons claros e escuros e seis esquemas de harmonia, e transforma qualquer um deles em gradiente num clique.
Gratuito e privado
Sem barreira de pagamento e sem rastrear o que escolhe. As imagens carregadas são lidas no navegador e não vão a lado nenhum.
Para quem é
- Designers e equipas de produto
- Ao esboçar uma interface ou paleta de marca, explorar combinações e copiar o CSS exato de um gradiente.
- Ilustração e pintura
- Para captar cores de fotografias e quadros com o conta-gotas e planear sombreados suaves.
- Desenvolvimento front-end
- Para produzir valores de cor coerentes num projeto e ler os valores de um design existente.
- Quem verifica acessibilidade
- Para comparar uma cor entre modelos e ajustá-la até o rácio de contraste passar o limiar exigido.
Como se usa
- 1
Escolha uma cor
Clique em qualquer ponto do campo de saturação e afine com os cursores de matiz e alfa. HEX, RGB e HSV acompanham.
- 2
Capte de uma imagem
Arraste uma imagem para a página ou escolha um ficheiro, depois clique no píxel que quer. Os códigos aparecem logo.
- 3
Construa um gradiente
Clique na barra para adicionar uma paragem e arraste-a para o sítio. Alterne entre linear e radial e defina o ângulo.
- 4
Copie e reutilize
Copie o valor ou a declaração CSS completa. Tudo o que escolhe fica guardado automaticamente.
Perguntas frequentes
Uma ferramenta pequena que não atrapalha
Começou como um utilitário interno: queríamos agarrar uma cor, ajustá-la e seguir, sem abrir primeiro um programa de design pesado. É de propósito uma só página, de propósito rápida, e vai continuar gratuita.
Extensões de navegador
Prefere captar cores diretamente das páginas que visita? As extensões para Chrome e Edge põem um conta-gotas na barra, guardam o seu próprio histórico e abrem esta ferramenta num clique.