Misturador de Cores Misture duas cores juntas com uma proporção ajustável e veja o gradiente completo.

🎨

Misturador de Cores

Misture duas cores juntas com uma proporção ajustável e veja o gradiente completo.

Escolha Duas Cores

Selecione as duas cores que você deseja misturar.

Ajuste a Proporção

Use o controle deslizante para controlar a proporção da mistura (0-100%).

Copie o Resultado

Copie a cor HEX resultante da mistura.

Loading tool...

What Is Misturador de Cores?

Uma misturadora de cores combina duas cores em qualquer proporção, mostrando a você a cor resultante exata junto com um gradiente de 11 etapas da faixa de mistura completa. A interpolação linear RGB produz a cor mista, que imita o efeito de misturar tintas ou criar transições de cor CSS. O controle deslizante de proporção permite uma transição suave de 100% da primeira cor para 100% da segunda. A ferramenta mostra tanto o resultado misto em uma pré-visualização grande quanto a faixa de gradiente completa para contexto. A mistura de cores é essencial para criar cores intermediárias para gradientes, encontrar cores de ponto médio para sistemas de design, gerar cores de transição para animações e entender como duas cores de marca interagem quando sobrepostas.

Why Use Misturador de Cores?

Controle deslizante de razão suave de 0% a 100% para mistura precisa
Amostra de visualização grande do resultado da mistura
Gradiente de 11 etapas completo que mostra o intervalo de mistura completo
Saídas HEX e RGB com botões de cópia
Veja instantaneamente como duas cores se combinam

Common Use Cases

Encontrando Pontos Médios

Encontre a cor exata do ponto médio entre duas cores da marca para transições suaves.

Design de Gradiente

Visualize como duas cores se misturarão em um gradiente antes de implementar no CSS.

Transições de Cor

Gere cores intermediárias para etapas de animação entre dois estados de cor.

Expansão da Paleta

Crie novas cores misturando cores existentes na paleta em várias proporções.

Technical Guide

A misturadora realiza interpolação linear (lerp) no espaço de cor RGB: resultado = cor1 × (1 - t) + cor2 × t, onde t é a proporção da mistura de 0 a 1. Cada canal (R, G, B) é interpolado independentemente. Este é o método de mistura mais simples e coincide com como as transições CSS interpolam entre cores. Existem métodos de mistura mais sofisticados (espaço Lab perceptual, oklab), mas a interpolação linear RGB é a mais amplamente utilizada e consistente com a renderização do navegador. O gradiente de 11 etapas visualiza a faixa completa de interpolação em intervalos de 10%. Observe que a interpolação linear RGB pode produzir pontos médios ligeiramente desaturados - por exemplo, misturar vermelho puro e verde puro produz um marrom-amarelado turvo em 50%, não amarelo brilhante. Isso ocorre porque a interpolação RGB não segue a roda de cores.

Tips & Best Practices

1
Uma mistura de 50% fornece o ponto médio visual exato entre duas cores
2
Tente misturar cores complementares - o ponto médio é frequentemente um interessante cinza neutro
3
Use a faixa de gradiente para encontrar a proporção em que a mistura parece melhor, não apenas 50%
4
Misturar com branco (tonalização) ou preto (sombreamento) em várias proporções cria escalas suaves
5
A mistura RGB pode produzir pontos médios desbotados - este é o comportamento esperado para a mistura aditiva

Related Tools

Seletor de Cores

Seletor de cores interativo com saídas em HEX, RGB, HSL e CMYK.

🎨 Color Tools

Gerador de Paleta Monocromática

Gere uma paleta de cores monocromáticas a partir de qualquer cor base.

🎨 Color Tools

Gerador de Gradiente Linear

Crie gradientes lineares CSS personalizados com cores, ângulo e paradas de cor.

🎨 Color Tools

Gerador de Matizes de Cor

Gere matizes mais escuros de qualquer cor com quantidade de passos ajustável.

🎨 Color Tools

Gerador de Matizes de Cor

Gere matizes mais claros de qualquer cor com quantidade de etapas ajustável.

🎨 Color Tools

Frequently Asked Questions

Q Como a mistura de cores é calculada?

As cores são misturadas usando interpolação linear no espaço RGB. Cada canal (R, G, B) é mesclado independentemente: resultado = canal1 × (1-proporção) + canal2 × proporção.

Q Por que a mistura de vermelho e verde produz marrom em vez de amarelo?

Na interpolação linear RGB, o caminho passa por valores intermediários desbotados. O verdadeiro amarelo está em uma posição diferente no espaço de cores. Para mistura consciente da roda de cores, use a interpolação HSL.

Q É essa uma mistura aditiva ou subtrativa?

Essa é uma mistura aditiva (baseada em luz) no espaço RGB, correspondendo à forma como as telas exibem cores. A mistura subtrativa tipo tinta produziria resultados diferentes (por exemplo, azul + amarelo = verde na tinta, cinza no RGB).

About This Tool

Misturador de Cores is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.