PortuguêsPT

Seletor de cores e conversor de códigos de cor

Escolha uma cor ou cole qualquer código de cor: todos os formatos mudam na hora.

Seus textos e arquivos não saem do navegador: nada é enviado para nenhum servidor.

#0F766E
Códigos de cor

Mais claras (misturadas com branco)
Mais escuras (misturadas com preto)

Clique em uma amostra para usar essa cor. O número é a porcentagem da mistura.

Variáveis CSS

Como usar

  1. Clique na caixa de cor para escolher uma cor ou cole um código em qualquer campo, como HEX ou RGB.
  2. Ao editar um campo, todos os outros mudam junto. Dá para digitar só os três números, sem “rgb(”.
  3. Escolha uma cor próxima nas fileiras de tons claros e escuros: ao clicar em uma, ela vira a nova cor base.
  4. Dê um nome à variável em “Variáveis CSS” e copie o bloco para a sua folha de estilos. A cor fica salva no endereço da página, então você pode compartilhar o link do jeito que está.

Perguntas frequentes

Qual a diferença entre HEX e RGB?

Os dois descrevem a mesma cor com notações diferentes. O HEX escreve os valores de vermelho, verde e azul (0–255) com dois dígitos hexadecimais cada, e o RGB escreve esses mesmos valores em números decimais.

Os valores CMYK saem impressos iguais à tela?

O CMYK mostrado aqui é uma conversão matemática simples, pensada como ponto de partida. As cores impressas de verdade dependem do papel, da tinta e do perfil de cor da impressora, então confirme os valores com a gráfica.

O que é OKLCH?

O OKLCH descreve uma cor pela luminosidade percebida (L), pelo croma (C) e pelo matiz (H). O CSS moderno aceita oklch() diretamente, e mudar só a luminosidade mantém o matiz com a mesma aparência.

Por que não aparece o botão “Pegar da tela”?

Ele só aparece em navegadores de computador compatíveis com a API EyeDropper, como Chrome e Edge. Em outros navegadores, use o conta-gotas de imagem para pegar cores de uma foto.

Ferramentas relacionadas

Conta-gotas de imagemPegue cores e uma paleta da fotoContraste de coresTaxa de contraste com resultados AA e AAAPaleta para Tailwind CSSDe uma cor a uma escala de 50 a 950Degradê CSSDegradês lineares, radiais e cônicos

Todas as ferramentas