Misturador de cores
NovoMisture duas cores em qualquer proporção e copie o resultado ou qualquer etapa.
Click a swatch to copy its hex.
Mix colors from an image
Upload an image, choose a target color above, then click the image to sample that pixel. Images are decoded in your browser and never uploaded.
Paint (subtractive) results are realistic approximations of pigment mixing, not exact recipes — real paints and inks vary by brand and opacity.
Runs entirely in your browser. Nothing is uploaded.
Um misturador de cores online gratuito para tinta ou luz
Este misturador de cores combina duas cores — ou mais — em uma nova e mostra o gradiente completo de passos entre elas. Escolha cores com as amostras, digite um código hex ou extraia-as diretamente de uma imagem carregada; depois veja o resultado misturado como HEX, RGB, HSL e CMYK. Tudo funciona no seu navegador, é instantâneo e nenhum arquivo seu é enviado para servidor algum.
Enquanto a maioria das ferramentas faz apenas uma mistura linear simples, esta permite misturar duas cores online de três formas diferentes e mostra a diferença em tempo real — para que você obtenha o resultado que um pintor esperaria, o que uma tela produz, ou um ponto médio matemático puro para gradientes e sistemas de design.
Subtrativo, aditivo ou mistura simples — três modelos de mistura
A mistura Subtrativa simula tinta e pigmento: as cores absorvem (subtraem) luz, então azul + amarelo = verde, vermelho + amarelo = laranja e vermelho + azul = roxo — os resultados intuitivos de 'que duas cores fazem X' que correspondem a tintas físicas, tintas gráficas e impressão CMYK. A mistura Aditiva simula luz: vermelho, verde e azul se somam, então vermelho + verde = amarelo e os três juntos formam branco — como funcionam telas, projetores e iluminação de palco.
O terceiro modo, Blend, é uma interpolação linear direta que calcula a média dos canais RGB para encontrar o ponto numérico exato — ideal para gradientes, tons de interface e geração de tokens de design. Um botão alterna entre os três modos, e a faixa de mistura se redesenha imediatamente para você ver a mistura de tinta de azul para amarelo passar por um verde realista no meio subtrativo.
Que duas cores fazem verde, laranja, roxo e marrom?
A tabela de mistura de cores embutida responde às perguntas de pigmento mais pesquisadas com um único toque: verde a partir de azul + amarelo, laranja a partir de vermelho + amarelo, roxo a partir de vermelho + azul, azul-petróleo a partir de azul + verde, e um marrom realista a partir de dois complementares como laranja + azul. Toque em qualquer par para carregá-lo no misturador em modo Subtrativo.
Como o motor subtrativo mistura do jeito que os pigmentos realmente funcionam, as cores secundárias ficam fiéis e as terciárias escurecem naturalmente em direção ao marrom — o mesmo efeito de 'sujar' que você obtém ao misturar tinta real demais. O controle deslizante de proporção permite ajustar com precisão: 70% vermelho + 30% azul dá um roxo mais quente e mais magenta do que uma mistura 50/50.
Misturar a partir de uma imagem — e misturar mais de duas cores
Faça upload de qualquer foto e use o conta-gotas para capturar cores diretamente dela — perfeito para igualar uma cor de marca a partir de uma foto de produto, uma amostra de tinta ou uma imagem inspiradora. Escolha dois ou mais pixels e misture-os. A imagem é decodificada localmente em um canvas HTML, então misturar cores a partir de uma imagem aqui significa que seu arquivo nunca sai do dispositivo — ideal para ativos de marca confidenciais e mockups de design ainda não publicados.
Precisa combinar mais de duas? Clique em 'Adicionar cor' para incluir uma terceira, quarta, quinta ou sexta amostra, cada uma com seu próprio controle de peso. A ferramenta retorna a mistura ponderada de todas as entradas — útil para calcular a média de uma paleta, recriar uma mistura de tinta com múltiplos pigmentos ou encontrar o centro visual de um conjunto de cores de marca.
Como se compara ao Adobe Color, Coolors e colordesigner.io
Adobe Color (color.adobe.com) é feito para exploração de harmonia de cores — complementar, triádico, análogo — e requer uma conta Adobe que sincroniza dados com os servidores da Adobe. Não tem modelo de mistura subtrativo (tinta) ou aditivo (luz) nem controle deslizante de proporção para misturar códigos hex específicos. Coolors (coolors.co) é ótimo para gerar paletas, mas o misturador de cores dele realiza apenas uma mistura linear básica — equivalente ao modo 'Blend' desta ferramenta.
colordesigner.io oferece mistura linear de duas cores e uma faixa de gradiente, mas exibe apenas valores hex — sem RGB, HSL ou CMYK — e não tem modelos de mistura baseados em física. Esta ferramenta preenche essa lacuna: três modelos de mistura, quatro formatos de saída simultâneos, amostragem de cores de imagem, até seis cores com controles de peso individuais e URL compartilhável. Sem conta, sem limites de uso, sem envio ao servidor.
Cada código pronto para copiar — e um link compartilhável
O cartão de resultado mostra os valores HEX, RGB, HSL e CMYK da cor misturada mais a cor CSS nomeada mais próxima, e um único clique copia qualquer um deles para a área de transferência. Gere de 2 a 20 amostras de pontos médios espaçados uniformemente entre suas duas cores, copie um passo individual ou capture toda a sequência de uma vez para um gradiente CSS ou rampa de cores do sistema de design.
Não há nada para instalar nem conta para criar. A mistura de cores, a amostragem de imagens e a conversão de código acontecem localmente no seu navegador — suas cores e imagens ficam no seu dispositivo. Salve nos favoritos o misturador de cores online e combine-o com o Gerador de Paletas de Cores e o Verificador de Contraste no UtiloKit para um fluxo de trabalho completo sem uploads.
Frequently asked questions
Como misturar duas cores online?
Escolha suas duas cores com as amostras ou digitando códigos hex, selecione um modelo de mistura (tinta/subtrativo, luz/aditivo, ou blend linear simples) e arraste o controle deslizante de proporção — por exemplo 30% / 70% — para controlar quanto cada cor contribui para o resultado. A cor misturada e seus códigos HEX, RGB, HSL e CMYK se atualizam instantaneamente; clique em qualquer linha de formato para copiá-la para a área de transferência.
Que duas cores fazem verde?
Azul e amarelo fazem verde quando você mistura tinta ou pigmento (mistura subtrativa). Defina o modelo como Subtrativo e misture um azul como #2563EB com um amarelo como #FACC15 para obter um verde em torno de #61A73A. Numa tela digital, onde você mistura luz (aditivo), as regras são diferentes — luz vermelha + verde = amarelo, e as três em intensidade máxima = branco.
Qual é a diferença entre mistura aditiva e subtrativa de cores?
A mistura aditiva combina luz: os canais vermelho, verde e azul se somam, então vermelho + verde = amarelo e os três em potência máxima = branco. Telas, projetores e TVs funcionam assim. A mistura subtrativa combina pigmentos que absorvem (subtraem) comprimentos de onda de luz; quanto mais pigmento você adiciona, mais escuro fica. Azul + amarelo = verde, e os três primários juntos produzem marrom. A impressão CMYK é subtrativa.
Como misturar dois códigos hex?
Digite ou cole cada código hex no seu campo — com ou sem o # inicial — por exemplo #FF5733 e #33C1FF. O misturador os combina imediatamente na proporção atual e retorna o código hex resultante junto com seus equivalentes RGB, HSL e CMYK. O código hex abreviado de três dígitos como #F53 também é aceito. Clique em qualquer linha de resultado para copiar.
Posso misturar cores a partir de uma imagem?
Sim. Abra o painel 'Misturar a partir de imagem', faça upload de qualquer foto ou captura de tela de design, depois clique no canvas para amostrar cores diretamente da imagem para seus slots de cor. A imagem é decodificada localmente em um canvas HTML no seu navegador com JavaScript — nenhum dado é enviado a qualquer servidor e suas imagens ficam completamente privadas no seu dispositivo.
Quantos passos de gradiente posso gerar entre duas cores?
O controle de passos permite gerar entre 2 e 20 amostras espaçadas uniformemente entre suas duas cores. Onze passos dão os dois extremos mais nove pontos intermediários — ideal para construir um gradiente CSS ou uma rampa de cores completa para um sistema de design. Clique em qualquer amostra individual para copiar seu código hex, ou use 'Copiar tudo' para pegar a sequência inteira.
É gratuito? Preciso me cadastrar?
Não. O misturador de cores é completamente gratuito, sem conta, sem cadastro, sem paywall e sem limites de uso. Abra a página e comece a misturar imediatamente. Ao contrário de algumas plataformas de design que bloqueiam recursos avançados de mistura de cores atrás de uma assinatura, tudo aqui — modelos subtrativo e aditivo, amostragem de imagens, mistura de múltiplas cores, passos de gradiente e todos os formatos de saída — está disponível gratuitamente na primeira visita.
Related tools
Ver todas as ferramentas
Novo Color Token Generator
Generate a full design-token scale (50–950 shades) from a single base color — CSS, Tailwind or JSON.
Seletor e conversor de cor
Escolha uma cor e converta entre HEX, RGB, HSL e OKLCH.
Novo Verificador de contraste de cores
Verifique as razões de contraste WCAG AA/AAA entre as cores de texto e fundo.
Novo Gerador de gradientes CSS
Crie gradientes CSS lineares, radiais e cônicos com prévia ao vivo.
Novo Gerador de box-shadow CSS
Crie box-shadows CSS em várias camadas com predefinições e prévia ao vivo. Copie o CSS, o valor ou o estilo React na hora.
Novo Gerador de paleta de cores
Gere paletas complementares, análogas, triádicas e monocromáticas.