Em que difere o HSL do HSV?

Ambos usam o tom (0–360°) e a saturação, mas o terceiro valor é diferente: o HSL usa a luminosidade e o HSV usa o valor (brilho). Por isso, os mesmos números originam cores diferentes.

O valor CMYK é adequado para impressão?

É apenas uma conversão aproximada a partir de RGB. Para impressão profissional, use o perfil de cor indicado pela sua gráfica.

O que significa um HEX de 8 dígitos?

Os dois últimos dígitos definem a opacidade (alfa): 00 é totalmente transparente e ff é totalmente opaco.

Porque é que os números diferem ligeiramente dos de outras ferramentas?

Os valores são arredondados para números inteiros, pelo que converter de um lado para o outro através de HSL ou CMYK pode alterar um canal em 1.

Conversor de cores: HEX, RGB, HSL, HSV, CMYK

Converta cores entre HEX, RGB, HSL, HSV e CMYK, verifique o contraste e crie uma paleta.

Seletor de cores

Opacidade (alfa): 1

HEX

RGB / RGBA

HSL / HSLA

HSV

CMYK

CSS

color: #2563eb;
color: rgb(37, 99, 235);
color: hsl(221, 83%, 53%);

Contraste WCAG

Calculado com a cor opaca como cor do texto.

Aa sobre branco

Razão: 5.17:1

Texto AA: Aprovado
Texto grande AA: Aprovado
Texto AAA: Reprovado
Texto grande AAA: Aprovado

Aa sobre preto

Razão: 4.06:1

Texto AA: Reprovado
Texto grande AA: Aprovado
Texto AAA: Reprovado
Texto grande AAA: Reprovado

Paleta

Clique numa amostra para a selecionar.

Tons mais claros e mais escuros

Cor complementar

Cores análogas

Como utilizar

Escolha uma cor com o seletor de cores ou escreva-a em qualquer campo: todos os outros formatos são atualizados de imediato. São aceites códigos HEX com 3, 4, 6 ou 8 dígitos (por exemplo #f80 ou #ff880080), bem como as notações rgb(), rgba(), hsl(), hsla(), hsv() e cmyk(). O seletor deslizante define a opacidade (alfa).

O botão junto a cada campo copia o respetivo valor, e a secção CSS fornece linhas color: já prontas a usar.

Contraste e acessibilidade

A ferramenta calcula a razão de contraste WCAG entre a cor escolhida e o branco e o preto. Para texto normal, o nível AA exige pelo menos 4,5:1 e o AAA exige 7:1. O texto grande (cerca de 24 px, ou 19 px em negrito) exige 3:1 e 4,5:1, respetivamente.

O contraste é calculado sem transparência, ou seja, com a cor totalmente opaca.

Paleta, CMYK e privacidade

A paleta mostra tons mais claros e mais escuros (misturados com branco ou preto), a cor complementar (oposta no círculo cromático) e as cores vizinhas. Clique numa amostra para a definir como cor atual.

O CMYK é calculado aqui com uma fórmula matemática simples, pelo que os resultados impressos podem diferir: as cores de impressão rigorosas dependem da impressora e do perfil de cor. Todos os cálculos são feitos no navegador e nenhum dado é enviado para lado nenhum.