O que é o espaço de cor OKLCH?

É um espaço de cor baseado na percepção humana, onde a luminosidade (L) e o croma (C) podem ser ajustados sem alterar o matiz (H).

Como funciona a verificação de gamut nesta ferramenta?

Ela calcula se as coordenadas da cor estão dentro dos limites físicos dos espaços sRGB e Display-P3, indicando se a cor será exibida corretamente.

O que significa a sugestão de recorte por redução de croma?

Quando uma cor está fora do gamut sRGB, a ferramenta reduz apenas o croma (saturação) até que ela caiba no espaço sRGB, mantendo a luminosidade e o matiz intactos.

Posso converter cores inserindo valores individuais de L, C e H?

Sim, você pode ajustar os campos numéricos de Luminosidade, Croma e Matiz diretamente para gerar as conversões em tempo real.

A ferramenta suporta o formato Display-P3?

Sim, ela gera a representação CSS color(display-p3 ...) e verifica se a cor está contida neste gamut de ampla gama de cores.

Elysia Tools

Navegação

Design

Conversor de Cores OKLCH

Converte entre HEX, RGB, HSL, OKLCH e Display-P3 com a matemática do CSS Color 4, com leitura de luminosidade/croma/matiz, verificação de gamut sRGB e Display-P3, e sugestão de recorte fora do gamut

Detalhes

O que esta ferramenta ajuda você a fazer

Cole qualquer cor (HEX, rgb(), hsl() ou oklch()) ou ajuste OKLCH L/C/H diretamente. A ferramenta converte entre todos os espaços modernos com as matrizes do CSS Color 4 e informa:

Valores HEX, sRGB 8-bit, sRGB linear, HSL, XYZ D65, OKLab e OKLCH
Representação Display-P3
Se a cor está dentro de sRGB, dentro de Display-P3 mas fora de sRGB, ou fora de ambos
Uma sugestão de recorte por redução de croma (o OKLCH dentro-do-gamut mais próximo) quando a cor está fora de sRGB

Por que OKLCH: seu canal L corresponde à luminosidade percebida e seus C/h são croma e matiz, então ajustar luminosidade ou saturação não desloca o matiz (ao contrário do HSL). Isso torna o OKLCH o melhor espaço para paletas perceptualmente uniformes.

As saídas são CSS prontos para copiar, incluindo color(display-p3 ...) e oklch().

Execução

Executar esta ferramenta

Preencha o formulário, execute a ferramenta e veja o resultado no mesmo lugar.

Resultado

Pronto para executar

Depois de executar, arquivos, texto, dados estruturados ou saída em streaming aparecerão aqui.

Exemplos

Exemplos compatíveis com esta ferramenta

Relacionado

Conversor de Cores OKLCH

O que esta ferramenta ajuda você a fazer

Executar esta ferramenta

Execuções de exemplo preparadas

Entradas

Resultado

Exemplos compatíveis com esta ferramenta

Continue com ferramentas e temas relacionados

Execuções de exemplo preparadas

Entradas

Resultado

Veja quando usar esta ferramenta, o que ela suporta e como os usuários a aplicam.

Fatos principais

Visão geral

Quando usar

Como funciona

Casos de uso

Exemplos

1. Conversão de Azul de Marca para OKLCH

2. Ajuste de Cor Fora do Gamut sRGB

Perguntas frequentes

Exemplos de códigos de cor

Exemplos de Processamento de Imagem Web Python

Exemplos de Processamento de Imagem Android Java

Exemplos de Processamento de Imagem Android Kotlin

Conversor de espacos de cor

Conversor de cores CMYK

Extrator de paleta de cores da imagem

Ferramenta de Cores Complementares Divididas

Ferramentas de conversao de espacos de cor para web e impressao

Geradores de efeitos CSS, paletas e tokens de design

Ferramentas de auditoria de acessibilidade web e cores acessiveis

Ferramentas de Design de Cor e Conversão de Espaços de Cor