Seletor e conversor de cores

Escolher uma cor e converter entre os formatos HEX, RGB e HSL instantaneamente. Gratuito e funciona inteiramente no seu navegador.

Texto preto na sua cor
Texto branco na sua cor

Como utilizar o seletor e conversor de cores

  1. Click the large color preview swatch to open your browser's native color picker.
  2. Em alternativa, digitar um valor HEX diretamente no campo HEX (ex. #ff5733).
  3. Ajustar os valores individuais R, G, B (0-255) ou os valores H, S, L para uma afinação precisa.
  4. Todos os formatos são atualizados em tempo real quando se altera qualquer valor.
  5. Utilizar os botões Copiar para copiar um valor de cor formatado para a área de transferência.
  6. Verificar a pré-visualização do contraste para ver como o texto preto e branco aparece na cor escolhida.

Perguntas frequentes

O que é o formato de cor HEX?

HEX é uma representação hexadecimal de seis dígitos de uma cor precedida por #. Cada par de dígitos representa os canais vermelho, verde e azul (ex. #ff5733 significa R=255, G=87, B=51). É o formato mais comum utilizado no web design e nos CSS.

Qual é a diferença entre RGB e HSL?

RGB define uma cor pelas suas componentes de luz Vermelho, Verde e Azul (0-255 cada). HSL define uma cor pela Matiz (0-360 graus na roda de cores), Saturação (0-100%%) e Luminosidade (0-100%%). HSL é frequentemente mais intuitivo para designers porque é possível ajustar facilmente a luminosidade ou a saturação sem afetar a matiz.

Porque é importante a verificação do contraste?

Um contraste suficiente entre o texto e as cores de fundo é essencial para a legibilidade e acessibilidade. As diretrizes WCAG recomendam um rácio de contraste mínimo de 4.5:1 para texto normal. A pré-visualização do contraste ajuda a verificar visualmente que o texto permanece legível na cor escolhida.

Os meus dados são armazenados em algum lugar?

Não. Todas as conversões de cor ocorrem inteiramente no seu navegador utilizando JavaScript. Nenhum dado é enviado para qualquer servidor.