( Grátis · no navegador · sem cadastro )
Editor HSL de cores no navegador.
Matiz. Saturação. Luminosidade. Céu mais azul. Pele natural. Oito faixas de cor.
Mexa em matiz, saturação e luminosidade de uma faixa por vez: o azul do céu sem tocar no verde das folhas.
Você também pode arrastar e soltar uma ou várias imagens nesta área.•Entradas aceitas: JPEG, PNG, WEBP, GIF e BMP quando o navegador consegue decodificá-las. Exportação disponível em JPEG e PNG, e em WEBP quando o navegador suporta a codificação.
A edição da imagem ocorre no navegador. O site ainda pode fazer requisições técnicas e, conforme seu consentimento, carregar medição ou publicidade. Consulte a Política de Privacidade.
- 01Sem instalação
- 02Edição no navegador
- 03Prévia antes de exportar
- 04Sem cadastro
( Como funciona )
Como ajustar uma faixa de cor
- ( 01 / 03 )
1. Abra a foto
Arraste um arquivo para a área de edição. Se quiser só experimentar, a foto de demonstração do projeto está ali do lado.
- ( 02 / 03 )
2. Escolha a cor que incomoda
São oito faixas no painel HSL. Selecione a que domina a área que você quer mudar e mexa em matiz, saturação ou luminosidade.
- ( 03 / 03 )
3. Confira antes de salvar
Alterne entre original e editado para ver o que mudou de fato e exporte em JPEG ou PNG. O WEBP entra na lista quando o navegador oferece suporte a essa codificação.
( A interface )
Interface atual da ferramenta
( O que faz )
O que o painel HSL faz
- 01
Oito faixas, controles independentes
Vermelho, laranja, amarelo, verde, ciano, azul, roxo e magenta. Mexer em uma não altera os controles das outras.
- 02
Matiz, saturação e luminosidade
Matiz empurra a cor para a vizinha no círculo cromático. Saturação decide o quanto ela é intensa. Luminosidade clareia ou escurece só aquela faixa.
- 03
Original a um clique
Dá para voltar à imagem de origem a qualquer momento e comparar as duas, sem desfazer o ajuste.
( Para que serve )
Situações em que o ajuste por faixa resolve
- ( 01 )
Céu lavado
Aumentar a saturação do azul costuma devolver o céu sem mexer no resto da paisagem, desde que o verde ocupe outra faixa.
- ( 02 )
Pele alaranjada
Laranjas e vermelhos aceitam correções pequenas. Vá de pouco em pouco e olhe sempre o que está em volta do rosto.
- ( 03 )
Roupas e objetos
Uma peça de cor marcante muda mexendo só na faixa dela — mas confira se outro objeto da mesma cor não foi junto.
- ( 04 )
Várias fotos na mesma linha
Aplicar parâmetros parecidos aproxima a paleta de um conjunto. Cada imagem ainda precisa de conferência própria.
( Para onde vão seus pixels )
( Processamento local )
Onde sua imagem é processada
A edição em si acontece no seu navegador. Ao abrir um arquivo, o navegador o decodifica em pixels mantidos na memória da página, e cada ajuste é um cálculo feito sobre esses pixels pelo processador do seu próprio aparelho. A exportação recodifica o resultado e o entrega ao navegador como download. O arquivo de imagem não é enviado a um servidor de edição em nenhuma dessas etapas.
Isso é uma afirmação sobre o processamento da imagem, não sobre a página como um todo. Carregar esta página é uma requisição de rede como qualquer outra, e a página pode fazer outras: fontes, scripts e — conforme a escolha feita no aviso de consentimento — medição ou publicidade. Essas requisições carregam as informações que qualquer requisição web carrega. A distinção importa, e a Política de Privacidade detalha o que é coletado e quando.
- Decodificação, edição e exportação rodam no seu aparelho, usando as APIs de Canvas do navegador.
- O arquivo de imagem não é enviado a um servidor de edição como parte do fluxo de edição.
- A própria página é servida pela rede e pode carregar medição ou publicidade consentidas.
- Fechar a aba descarta a cópia de trabalho mantida na memória da página.
( Dúvidas? Respondidas )
Perguntas frequentes
O que significa HSL?
São as iniciais de matiz, saturação e luminosidade — em inglês, hue, saturation e lightness. São os três controles que o painel oferece para cada faixa de cor.
Por que outra parte da foto mudou junto?
Porque a seleção é por faixa de cor, não por objeto. Se a camisa e a parede têm o mesmo azul, as duas entram na mesma faixa e mudam juntas.
Preciso criar conta?
Não. O fluxo atual de edição e exportação não exige cadastro.
A imagem vai para algum servidor?
O processamento dos pixels acontece no navegador. As requisições normais do site e os serviços que dependem do seu consentimento estão descritos na Política de Privacidade.
Em que formatos dá para salvar?
O modal de exportação oferece JPEG e PNG, e acrescenta WEBP quando o navegador suporta essa codificação.
( A fundo )
Trabalhando em matiz, saturação e luminosidade
O HSL reescreve a cor em termos sobre os quais uma pessoa consegue raciocinar. Onde o RGB descreve uma cor como três quantidades de luz, o HSL a descreve como uma posição na roda de cores, uma distância do cinza e um brilho — três perguntas com respostas intuitivas. Essa mudança de coordenadas é o que torna o ajuste seletivo de cor acessível.
Por que existe um segundo modelo de cor
O RGB descreve a cor do jeito que uma tela a produz: quantidades de luz vermelha, verde e azul somadas. É exato e é difícil de raciocinar, porque os componentes não correspondem a nada que uma pessoa perceba. Tornar uma cor ligeiramente mais alaranjada sem mudar seu brilho significa ajustar os três números juntos numa relação que não é óbvia.
O HSL reexpressa as mesmas cores em três dimensões perceptivas. Matiz é um ângulo ao redor de uma roda de cores, do vermelho pelo amarelo, verde, ciano, azul e magenta de volta ao vermelho. Saturação é a distância do eixo cinza central — zero é neutro, o máximo é a forma mais pura daquele matiz. Luminosidade é quão clara ou escura a cor é, do preto pela cor até o branco.
Os dois modelos descrevem o mesmo conjunto de cores; o HSL é uma transformação do RGB, não um gamute diferente. O que ele muda é quais perguntas ficam fáceis. 'Deixar os verdes menos amarelados' é um ajuste em HSL e um cálculo em RGB, e essa é toda a razão pela qual o modelo é usado em ferramentas de edição.
As oito faixas, e o que uma faixa realmente é
Um painel de cor seletiva divide a roda de matizes em bandas nomeadas — tipicamente vermelho, laranja, amarelo, verde, ciano, azul, roxo e magenta — e oferece três controles dentro de cada uma. O importante a entender é que são faixas de matiz, não seleções de objetos. Ajustar a faixa azul age sobre todo pixel cujo matiz cai naquela banda, onde quer que ele apareça.
Isso tem uma consequência direta que surpreende na primeira vez: ajustar os azuis para aprofundar um céu também vai afetar roupas azuis, placas azuis e o componente azul de sombras caindo sobre superfícies neutras. Nada está errado quando isso acontece. A ferramenta faz exatamente o que promete — ela seleciona por cor, e aqueles pixels são daquela cor.
As bandas também se sobrepõem em suas fronteiras em vez de se encontrarem em bordas duras, e isso é deliberado. Uma fronteira dura produziria bandeamento visível sempre que um gradiente cruzasse de uma faixa para a seguinte: um céu variando de azul para ciano mostraria uma emenda. Sobrepor as bandas significa que um pixel perto de uma fronteira é afetado parcialmente por cada controle vizinho, e a transição permanece suave.
O tom de pele ocupa uma banda estreita e implacável
A pele humana, em toda a variedade de tons, ocupa uma fatia surpreendentemente estreita da roda de matizes — em geral entre o vermelho e o amarelo, concentrada nos laranjas. Os tons de pele diferem muito mais em luminosidade e saturação do que em matiz. Isso é útil de saber porque significa que o controle de laranja é o que governa a pele, e significa que esse controle merece movimentos menores que os outros.
O observador também é mais sensível a erro na pele do que em qualquer outra cor, porque tem uma referência de uma vida inteira do que ela deveria parecer. Uma dominante verde na vegetação passa despercebida; a mesma magnitude de desvio num rosto é imediatamente visível como errada. Um deslocamento de matiz de poucos graus nos laranjas costuma ser o limite antes que um tom de pele comece a ser lido como queimado de sol numa direção ou amarelado na outra.
A abordagem prática é tratar os controles de laranja e vermelho como ajustes finos e usar luminosidade em vez de saturação quando a pele parecer chapada. Aumentar a luminosidade dos laranjas clareia a pele deixando a cor em paz, o que quase sempre está mais perto do que a imagem precisava do que acrescentar saturação.
Onde a cor seletiva realmente separa
A técnica funciona melhor quando as cores que você quer mudar estão distantes na roda das cores que quer deixar em paz. Uma paisagem é quase o caso ideal: céu e água ficam no azul e no ciano, a vegetação fica no verde e no amarelo, e os dois grupos mal se sobrepõem. Aprofundar os azuis e ajustar os verdes de forma independente produz exatamente o resultado que os controles sugerem.
Funciona pior quando a imagem é dominada por uma única família de matizes. Uma cena de outono em que as folhas, a luz e o chão estão todos na faixa do vermelho ao amarelo oferece pouco para a ferramenta separar — todo controle que você mexer move a maior parte do quadro. Nessas imagens os ajustes úteis são globais, e a cor seletiva tem pouco a contribuir.
Um diagnóstico útil antes de começar: nomeie os dois ou três grupos de cor da imagem e pergunte se são vizinhos na roda. Se forem, espere que os ajustes vazem uns nos outros, e planeje mudanças menores do que faria de outra forma.
A luminosidade é o controle que passa despercebido
Dos três controles de cada faixa, a luminosidade é o que mais frequentemente produz o resultado que as pessoas buscavam com os outros dois. Escurecer a luminosidade da faixa azul aprofunda um céu de um jeito que é lido como luz natural, porque é o que acontece com um céu ao escurecer. Aumentar a saturação da mesma faixa produz um azul mais intenso que com frequência é lido como processado, porque céus reais não ficam mais coloridos ao escurecer.
O mesmo vale para a vegetação. Baixar a luminosidade dos verdes e amarelos faz a vegetação parecer mais densa e melhor iluminada; aumentar sua saturação a faz parecer artificial bem rápido, porque o olho sabe aproximadamente quão colorida uma folha pode ser.
O hábito que vale construir é tentar a luminosidade primeiro sempre que uma região de cor parecer fraca, e acrescentar saturação só se a luminosidade sozinha não tiver chegado lá. É o ajuste com menor probabilidade de se anunciar como edição.
( Continue )
Continue pelo fluxo certo
- ( 01 )Ajustar fotoCorrija luz e contraste antes do refinamento seletivo de cor.Ler
- ( 02 )Exemplos HSL medidosCompare três exportações reais, parâmetros e diferenças de pixels.Ler
- ( 03 )Guia de HSLEntenda os controles e uma ordem de trabalho reproduzível.Ler
- ( 04 )Comparação de formatosCompare tamanho e diferença de pixels medidos a partir da mesma imagem.Ler
( Quando quiser )
Pronto para ajustar uma faixa de cor?
Abra uma imagem, faça uma alteração pequena e compare com o original antes de exportar.