Entrada de cor
Escolha ou digite uma cor
Cor válida.
Ferramenta de design web
Seletor de cores
Escolha uma cor com o seletor nativo, HEX ou controles RGB precisos; copie formatos, explore harmonias, veja tons claros e escuros e defina texto legível.
Prévia ao vivo
Valores da cor
Copiar códigos de cor
HEX#16735F
RGBrgb(22, 115, 95)
HSLhsl(167.1, 67.9%, 26.9%)
HSVhsv(167.1, 80.9%, 45.1%)
Estimativa CMYKcmyk(80.9%, 0%, 17.4%, 54.9%)
Variável CSS--color: #16735F;
Acessibilidade
Contraste do texto
Texto de exemplo sobre a cor selecionada
Texto branco5.48:1
Texto preto3.83:1
Cor de texto sugeridaUse texto branco.
Luminância relativa0.142
As relações usam luminância relativa WCAG. Texto normal precisa de 4,5:1 para AA e 7:1 para AAA; texto grande precisa de 3:1 para AA.
Harmonia de cores
Paleta gerada
Escolha um modo de harmonia e selecione qualquer amostra para torná-la a nova cor base.
Escala de cores
Tons claros e escuros
Tons claros
Tons escuros
Os tons claros se aproximam do branco e os escuros do preto, preservando a matiz e a saturação selecionadas.
Notas do seletor de cores
HEXHEX é compacto e funciona bem em CSS, tokens de design e especificações compartilhadas.
RGBRGB oferece controle direto dos canais vermelho, verde e azul para navegador e canvas.
HSLHSL separa matiz, saturação e luminosidade, facilitando a criação de cores de interface relacionadas.
WCAGAs relações de contraste WCAG ajudam a escolher texto preto ou branco legível sobre o fundo selecionado.
Perguntas frequentes
Posso usar como seletor de cor HEX?
Sim. Use o seletor nativo ou digite um HEX rigoroso de três ou seis dígitos e copie HEX, RGB, HSL, HSV, a estimativa CMYK ou uma variável CSS.
O conta-gotas funciona em todos os navegadores?
Não. O botão usa a API EyeDropper quando disponível e mostra uma mensagem clara se não houver suporte ou a seleção for cancelada.
Como as cores da paleta são geradas?
As paletas complementar, análoga, triádica, complementar dividida, tetrádica e monocromática são calculadas localmente a partir dos valores HSL da cor escolhida.
Qual relação de contraste o texto deve atingir?
WCAG AA exige 4,5:1 para texto normal e 3:1 para texto grande. AAA exige 7:1 para texto normal.