Gerador de Duotone

Crie um tratamento de imagem em duas cores

O duotone é uma técnica gráfica clássica que reduz uma foto a duas cores dominantes. Em vez de preservar o matiz original de cada pixel, a imagem é convertida em valores tonais e depois mapeada entre uma cor de sombras e uma cor de realces. Este gerador de duotone executa esse processo diretamente num canvas HTML no seu navegador. Carregue uma imagem, escolha as duas cores, veja a pré-visualização do resultado e descarregue um PNG sem enviar o ficheiro para um servidor.

O efeito é útil para imagens de destaque, gráficos editoriais, artes para redes sociais, capas ao estilo de álbum, blocos de funcionalidades de produto e campanhas de marca em que fotos comuns precisam de parecer unificadas. Uma paleta de azul-marinho e creme pode transmitir seriedade e calor, enquanto roxo e ciano parecem enérgicos e digitais. Como o mapeamento se baseia no brilho, as fotos com uma estrutura clara de luz e sombra costumam produzir os melhores resultados. Capturas de ecrã planas ou imagens de muito baixo contraste podem precisar de edição antes de o tratamento duotone ficar dramático.

Como o navegador processa a imagem

Depois de a imagem ser descodificada localmente, o canvas lê cada pixel. Calcula-se um valor de luminância a partir dos canais vermelho, verde e azul, e esse valor passa a ser uma proporção de mistura entre as duas cores selecionadas. Os pixels escuros ficam perto da cor das sombras, os pixels claros aproximam-se da cor dos realces e os meios-tons misturam-se entre elas. O canal alfa é preservado, por isso as imagens PNG transparentes continuam transparentes no resultado exportado.

Como escolher melhores cores duotone

As paletas duotone fortes costumam combinar uma cor escura com outra muito mais clara. Se as duas cores tiverem brilho semelhante, a imagem final pode parecer sem vida porque as sombras e os realces se fundem. Comece com uma cor de marca profunda para as sombras e um acento claro para os realces, e depois troque as cores se a atmosfera parecer invertida. Depois de descarregar o PNG, teste-o no layout final com texto e chamadas para ação. Um belo tratamento de imagem continua a precisar de contraste suficiente em redor de qualquer conteúdo em primeiro plano colocado por cima.