Conversor de Cores

HEX ↔ RGB ↔ HSL com seletor de cor

Carregando…

Esta ferramenta foi útil?

About this tool

Esta ferramenta converte um código de cor HEX em valores RGB e HSL, e calcula se um texto branco ou preto fica mais legível sobre ele. Também mostra uma paleta de seis níveis que mantém o mesmo matiz e saturação enquanto varia apenas a luminosidade, útil para escolher tons de design.

How to use

  1. Clique no seletor de cores ou digite um valor HEX diretamente (funcionam tanto 3 quanto 6 dígitos).
  2. RGB, HSL e uma notação amigável para variáveis CSS (R G B separados por espaço) aparecem logo abaixo.
  3. Clique em qualquer uma das seis variantes de luminosidade do mesmo matiz para mudar para essa cor.
  4. Abaixo da caixa de pré-visualização, verifique se o texto branco ou preto tem mais contraste, e veja a razão de contraste exata.

Frequently asked questions

Quais formatos de cor esta ferramenta suporta?
Ela recebe HEX (3 ou 6 dígitos) como entrada e o converte em RGB, HSL, e uma notação 'R G B' separada por espaço para variáveis CSS (como em rgb(var(--x) / 0.5)). Formatos de impressão como CMYK não são suportados.
Como a razão de contraste é calculada?
Ela calcula a luminância relativa de cada cor usando a fórmula WCAG, e depois a compara com fundos branco e preto para obter a razão de contraste. Um número maior significa mais contraste e texto mais legível.
Como as seis variantes de luminosidade são geradas?
Elas mantêm o matiz (H) e a saturação (S) da cor de entrada inalterados e variam apenas a luminosidade (L) em 90/75/60/45/30/15% para construir a paleta de seis níveis.
O valor de cor que eu insiro é enviado a um servidor?
Não. Toda a conversão e o cálculo de contraste acontecem no seu navegador e nunca são enviados a um servidor.

Ferramentas similares