Um sistema de coordenadas para a cor: eixos, intervalos e uma regra que vincula os números à luz mensurável. A visão humana é tricromática, com três tipos de cones (S, M, L), por isso três coordenadas são o mínimo para descrever qualquer cor que o olho consegue ver. O mesmo laranja é rgb(255 128 0), oklch(0.732 0.186 53) e XYZ [49, 36.7, 4.5]. Uma paleta é um punhado de cores escolhidas; um espaço é uma forma de registrar qualquer cor.

Um modelo de cor define os componentes usados para descrever uma cor: três primárias no RGB, matiz, saturação e claridade no HSL, quatro tintas no CMYK. Um espaço de cor especifica as primárias, o ponto branco e a curva de codificação, para que cada conjunto de valores corresponda a uma cor mensurável. Por isso, rgb(255 0 0) representa vermelhos diferentes em sRGB, Display P3 e Adobe RGB: um modelo, três espaços.

No uso comum, ambos são chamados de espaços, inclusive no color-mix(in hsl, …) do CSS e neste catálogo. Um modelo pode usar um espaço já definido como referência: aqui, HSL e HSV são derivados do sRGB, como no CSS.

Depende da tarefa:

• armazenar e compartilhar imagens — sRGB, o padrão da web;
• criar paletas e gradientes — OKLCH, em que diferenças numéricas iguais correspondem a diferenças visuais iguais;
• cálculos com luz (mesclagem, desfoque, 3D) — RGB em luz linear;
• gravar vídeo e fazer a correção de cor — o espaço log da sua câmera, com entrega em Rec. 709 ou Rec. 2100;
• medir quão diferentes duas cores parecem — CIELAB ou DIN99o.

Para ver todos os espaços organizados por tarefa, agrupe o catálogo por finalidade.

OKLCH. Ele mantém os mesmos três parâmetros — matiz, croma, claridade –, mas a claridade dele corresponde à percebida: no HSL, o amarelo em L=50 emite cerca de 13 vezes a luz do azul em L=50, então L igual não significa brilho igual. No OKLCH, significa. O CSS tem suporte nativo a oklch().

Digite ou cole o valor no campo de cor no topo, por exemplo #ff8000. Todos os espaços da página mostram essa cor ao mesmo tempo; em OKLCH os valores são 0.732, 0.186, 53, que o CSS escreve como oklch(0.732 0.186 53). A aba css de cada dossiê traz a forma pronta para copiar, e no código é space.rgb.oklch(255, 128, 0).

Porque são calculados em sRGB codificado com gama, onde tirar a média dos números de duas cores produz uma luz mais escura e mais apagada do que misturar de fato a sua luz produziria. Interpolar no OKLab evita isso; em CSS, fica linear-gradient(in oklab, red, blue). A linha interpolar de cada dossiê mostra a mesma transição em dois espaços, lado a lado, para que você veja a diferença antes de escolher.

Abra o espaço log da sua câmera, como S-Log3, LogC4 ou Apple Log. No bloco LUT dele, escolha Rec. 709 e o seu editor: DaVinci Resolve, Premiere Pro, Final Cut Pro, OBS, ffmpeg e outros. O seu navegador gera o arquivo .cube. É uma conversão técnica, sem mapeamento de tons: as altas luzes acima do branco difuso são cortadas, e o look fica por sua conta.

Uma cor que um espaço consegue descrever, mas outro — ou a sua tela — não consegue mostrar. Um verde vívido do Display P3 não existe no sRGB: converta-o, e os números caem fora da faixa válida. O atlas deixa isso à vista: um ⚠ ao lado da cor atual indica que ela está fora do Limite escolhido, segurar Alt sobre um plano ou uma faixa mostra de qual gamut mais amplo uma cor ali precisa (P3, Rec. 2020), e os trechos fora da faixa aparecem esmaecidos sobre um quadriculado.

Uma tela emite luz; o papel reflete o que suas tintas não absorvem. A tinta sobre o papel reproduz menos cores vivas — azuis, verdes e vermelhos RGB saturados ficam fora do seu gamut — e por isso saem mais apagados. Na pré-impressão, a conversão usa um perfil ICC feito para a impressora e o papel, como o FOGRA39 para papel couché europeu ou o GRACoL nos EUA. O CMYK deste catálogo é a fórmula simples que o CSS usa para device-cmyk() sem perfil: correta nos números, mas não serve como prova de impressão.

Para a web e para compartilhar, sRGB: navegadores e celulares o adotam por padrão quando o arquivo não traz perfil. O Display P3 reproduz mais das cores vivas de uma cena nas telas da Apple e de muitos aparelhos Android, desde que o perfil continue incorporado. Envie em Adobe RGB quando um laboratório de impressão pedir. Reserve o ProPhoto RGB para edição em 16 bits: o gamut dele é tão amplo que arquivos de 8 bits ficam com faixas visíveis.

As conversões são fórmulas fechadas, não aproximações por tabela, e a conversão de ida e volta devolve os valores originais dentro do erro de ponto flutuante. As poucas exceções estão documentadas onde ocorrem: o OSA-UCS não tem inversa fechada, e sistemas de atlas como o Munsell interpolam entre os valores tabelados publicados. A saída em rgb nunca é limitada ao intervalo: uma cor fora do sRGB volta abaixo de 0 ou acima de 255, então limite-a só na hora de exibir.

E são verificadas: cada espaço cita o artigo ou a especificação que implementa, os valores são comparados com os do colorjs.io onde os dois coincidem, e os logs de câmera com as transformações ACES oficiais da Academia. formula-verification.md registra o que foi conferido com o quê — inclusive alguns pontos em que os próprios artigos publicados tinham erros.

Se os números diferem dos de outra biblioteca, compare as faixas: esta mantém as faixas convencionais de cada espaço — RGB 0–255, claridade Lab 0–100, matiz 0–360 — enquanto muitas normalizam tudo para 0–1. Cada cartão mostra suas faixas; no código elas são space.oklch.range.

Nativamente rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), além de color() para Display P3, Adobe RGB, ProPhoto, sRGB linear e XYZ (D65 e D50). O rec2020 do CSS é uma curva gama 2.4 pura, não a curva BT.2020 do Rec. 2020 deste catálogo — os mesmos números corresponderiam a outra cor. A aba css de cada dossiê mostra a cor atual pronta para copiar; os espaços que o CSS não tem são oferecidos como perfis ICC ou LUTs.

Abra Exibição e escolha uma opção em Visão: cegueira ao vermelho (protanopia), cegueira ao verde (deuteranopia) ou cegueira ao azul (tritanopia). O catálogo é redesenhado como esse olho o vê, para você conferir se as cores de uma paleta continuam distinguíveis. Cerca de 1 em cada 12 homens tem deficiência na visão de cores, segundo o NEI.

São produtos licenciados: suas cores são definidas por dados que os proprietários vendem, não por fórmulas publicadas — então não há matemática aberta para implementar, e redistribuir suas tabelas seria ilegal. Sistemas próximos com matemática pública estão aqui: Munsell (a renotação de 1943 é pública) e RAL Design (definido diretamente em CIELAB). Todo sistema cuja matemática tenha sido publicada algum dia tem lugar aqui; sugira um que esteja faltando.