Seletor e Conversor de Cores

• Conversão instantânea em tempo real: cada formato se atualiza no momento em que você muda qualquer valor - escolha uma cor na tela, arraste o controle de matiz ou digite diretamente em qualquer campo HEX, RGB, HSL, HSV, CMYK, HWB ou LAB. Sem botão para pressionar.
• Sete formatos de cor incluindo CIE LAB: o conversor suporta HEX, RGB, HSL, HSV, CMYK, HWB e CIE LAB - o espaço de cor perceptualmente uniforme usado em impressão, fotografia e ciência da cor. Todos os formatos são editáveis e copiáveis.
• Seletor visual + verificador de contraste WCAG: a tela de saturação-luminosidade e o controle de matiz dão controle visual preciso. O verificador de contraste WCAG integrado mostra o status de aprovação/reprovação AA e AAA da sua cor sobre fundos branco e preto.
• 100 % privado - sem uploads: todas as conversões acontecem localmente no seu navegador. Nenhum dado de cor é enviado a servidores, armazenado ou registrado. O conversor funciona totalmente offline após a página carregar.

• Desenvolvimento web e de UI: converta tokens de design entre HEX e HSL para propriedades personalizadas de CSS, ou obtenha os valores RGB exatos para trabalho com canvas e WebGL. O conversor dá a você todos os formatos que um desenvolvedor web precisa em um só lugar.
• Sistemas de design e cores de marca: verifique se suas cores de marca são consistentes entre representações HEX (web), CMYK (impressão) e LAB (perceptual). Use o conversor para manter a fidelidade de cor em todos os meios.
• Design de impressão e pré-impressão: converta cores de tela para CMYK para produção de impressão, ou use valores CIE LAB para especificação de cor independente de dispositivo. O conversor lida com precisão com conversões de sRGB para CMYK e sRGB para LAB.
• Acessibilidade e conformidade WCAG: verifique instantaneamente a taxa de contraste da sua cor de primeiro plano sobre fundos branco e preto. O verificador WCAG integrado mostra o status AA e AAA para você escolher cores acessíveis sem sair da ferramenta.
• Fotografia e correção de cor: use valores HSV para igualar matiz, saturação e brilho das cores em fluxos de edição fotográfica. A saída LAB do conversor é útil para correspondência perceptual de cores sob diferentes condições de iluminação.
• Arte digital e ilustração: escolha cores na tela visual e obtenha seus valores exatos em todos os formatos para usar no Figma, Sketch, Procreate ou qualquer outra ferramenta de design. As amostras predefinidas dão acesso rápido a cores de design comuns.

Um seletor e conversor de cores permite escolher qualquer cor visualmente e ver instantaneamente seus valores equivalentes em todos os principais formatos de cor. Diferentes ferramentas e fluxos de trabalho usam diferentes representações de cor - desenvolvedores web usam HEX e RGB , designers usam HSL e HSV , profissionais de impressão usam CMYK , e cientistas de cor usam CIE LAB . Este conversor lida com todos os sete formatos com conversão precisa e bidirecional - mude qualquer valor e todos os outros se atualizam instantaneamente.

A conversão acontece em três etapas, inteiramente no seu navegador:

1. Escolha ou insira uma cor: use a tela de saturação-luminosidade e o controle de matiz para seleção visual, clique no seletor de cor nativo do navegador, digite um código HEX ou insira valores diretamente em qualquer campo de formato (RGB, HSL, HSV, CMYK, HWB ou LAB).
2. Conversão instantânea no navegador: todos os valores são convertidos através de uma representação intermediária RGB comum usando matemática de cor precisa (sRGB para XYZ para LAB para formatos perceptuais). Seus dados de cor nunca saem do seu navegador.
3. Copie qualquer formato: clique no ícone de copiar ao lado de qualquer linha de formato para copiar esse valor, ou clique em «Copiar tudo» para copiar todos os formatos de uma vez. A saída de variável CSS está pronta para colar diretamente na sua folha de estilos.

• HEX: notação hexadecimal de seis dígitos (#RRGGBB) - o padrão para HTML, CSS e a maioria das ferramentas de design.
• RGB: canais vermelho, verde e azul (0-255) - usado em CSS, canvas, WebGL e processamento de imagens.
• HSL: matiz, saturação, luminosidade - mais intuitivo para designers; função de cor CSS nativa desde CSS Color Level 4.
• HSV: matiz, saturação, valor - usado no Photoshop, Figma e na maioria dos seletores de cor profissionais.
• CMYK: ciano, magenta, amarelo e key (preto) - o padrão para produção de impressão e fluxos de pré-impressão.
• HWB: matiz, brancura, negritude - uma função de cor CSS mais recente (CSS Color Level 4) mais intuitiva que HSL para misturar com branco/preto.
• CIE LAB: espaço de cor perceptualmente uniforme (L* = luminosidade, a* = eixo verde-vermelho, b* = eixo azul-amarelo) - usado em ciência da cor, perfis ICC e correspondência de cor independente de dispositivo.

O verificador de contraste WCAG calcula a luminância relativa da sua cor e calcula sua taxa de contraste contra branco puro (#FFFFFF) e preto puro (#000000). Uma taxa de 4,5:1 atende WCAG 2.1 AA para texto normal, 3:1 atende AA para texto grande e componentes de UI, e 7:1 atende AAA para texto normal. Use-o para garantir que suas cores de texto sejam acessíveis a usuários com baixa visão.