Misturador de cores

• Mistura de cores instantânea: misture duas cores em tempo real enquanto ajusta o controle de proporção. Troque o modo de mistura e veja o resultado atualizar na hora — sem clicar em botões.
• Seguro e privado: suas cores são misturadas 100% no lado do cliente, no navegador. Nada é enviado a servidores, então você pode trabalhar com cores de marca e paletas proprietárias sem risco.
• Três modos de mistura: escolha sRGB (padrão CSS), Linear (com correção gama) ou Oklab (perceptualmente uniforme). Cada modo gera resultados visuais diferentes para a mesma proporção.
• 100% grátis para sempre: totalmente grátis, sem cadastro, sem limites de uso e sem anúncios bloqueando a interface. Misture cores quantas vezes precisar.

• Mistura de cores da marca: misture as cores primárias da marca para gerar cores secundárias e terciárias da paleta. Use a prévia de gradiente para encontrar o ponto médio exato que atende às diretrizes da marca.
• Design e temas de interface: crie estados hover, estados desabilitados e fundos tingidos misturando a cor primária com branco ou preto em diferentes proporções. Exporte os resultados direto como valores CSS.
• Prévia do CSS color-mix(): veja como a função CSS color-mix() vai misturar duas cores antes de escrever o código. O modo sRGB corresponde exatamente ao espaço de mistura padrão do CSS.
• Geração de paletas: gere gradientes suaves entre duas cores âncora para visualizações de dados, gráficos e mapas de calor. A prévia de 11 passos mostra toda a faixa num relance.
• Edição e retoque de fotos: calcule a cor de mistura exata necessária para alcançar um tom alvo na edição. Use o modo Oklab para uma mistura perceptualmente precisa que acompanha a visão humana.
• Acessibilidade e contraste: misture cores de primeiro plano e fundo para encontrar um ponto médio que melhore a legibilidade. Use o resultado com um verificador de contraste para confirmar a conformidade com WCAG.

Um misturador de cores combina duas cores em uma proporção configurável e mostra a cor resultante em vários formatos. Diferente de uma média simples, a mistura de cores pode ser feita em espaços de cor diferentes, cada um com resultados visualmente distintos. Nosso misturador aceita três modos: sRGB (o padrão CSS), Linear (com correção gama) e Oklab (perceptualmente uniforme). Toda a mistura roda na hora no navegador, sem envio a servidores.

1. Informe duas cores: digite qualquer valor HEX ou RGB nos campos de cor, ou use o seletor nativo. O misturador aceita qualquer formato de cor CSS válido.
2. Defina a proporção: arraste o controle para indicar quanto de cada cor incluir. 50% dá uma mistura igual; 25% dá 75% da cor 1 e 25% da cor 2. Clique em qualquer passo da prévia para ir a essa proporção na hora.
3. Copie o resultado: a cor misturada aparece em HEX, RGB, HSL e HSV com botões de cópia em um clique. Use a prévia de gradiente para explorar toda a faixa entre as duas cores.

• Mistura sRGB: interpola diretamente entre os valores de canal sRGB (0-255). Corresponde à função CSS color-mix(in srgb) e é o modo mais previsível para desenvolvimento web.
• Mistura Linear: converte as cores em luz linear (remove a codificação gama) antes de misturar e depois reaplica o gama. Gera resultados fisicamente mais precisos na mistura de luz — os pontos médios parecem mais claros que no modo sRGB.
• Mistura Oklab: mistura as cores no espaço perceptualmente uniforme Oklab. Os pontos médios parecem visualmente equidistantes das duas cores de entrada, evitando os marrons acinzentados que aparecem ao misturar cores complementares em sRGB. Ideal para design e geração de paletas.
• Formatos de saída: a cor misturada é sempre retornada em HEX, RGB, HSL e HSV. Todos os valores são arredondados para o inteiro mais próximo, prontos para copiar e colar.