Como fazer degrade colorido que não pareça amador
A maioria das pessoas aperta o gradiente do Photoshop e arrasta uma cor até a outra. O resultado costuma ficar plástico demais, sem profundidade. O problema não é a ferramenta, é que você tá pensando em degradê como algo que vai do zero ao 100. Na prática, degrade colorido precisa de direcionamento e de transições que respeitem o espaço de cor que você está usando. Vou explicar o processo direto, sem enrolação. Primeiro, abre o After Effects ou o Blender — dá no mesmo o princípio — e cria um novo sólido. Clica no efeito de gradiente radial ou linear, dependendo do que você quer. Aí vem o pulo do gato: não use apenas duas cores. Adiciona pelo menos três stops. Posiciona o stop do meio mais perto de uma das pontas. Isso quebra a simetria que todo mundo faz e que deixa tudo com cara de template grátis.
Se você tá trabalhando em RGB para web, usa o modo de interpolação Hue Nearest ou Hue Longer. O padrão do After Effects (shortest hue) às vezes atravessa o espectro errado e gera faixas esverdeadas indesejadas quando você junta vermelho com azul. Eu perdi umas três horas num projeto de motion graphics pra uma agência porque o degrade saía com aquele tom avermelhado estranho no meio. A solução foi ir em Preferences > Interpretation e mudar a interpolação de cor, além de usar cores extraídas de uma imagem real em vez de cores do picker nativo. Dica: use a ferramenta conta-gotas num reference image com luz natural.
O que é degrade colorido de verdade
Degradê colorido é simplesmente a transição suave entre duas ou mais cores em um espaço definido. O "colorido" é redundante porque todo degradê que não seja preto no branco já tem cor. O termo que as pessoas usam aqui no Brasil veio das redes sociais e dos freelancers que copiam tutorial sem entender o porquê. No fundo, é o mesmo conceito de gradient de luz que existe na pintura digital desde os anos 90. O que diferencia um degrade bom de um ruim é a escolha da paleta e a curvatura dos stops. Cores com luminância similar criam uma transição mais calma. Pular de tons escuros para claros demais cria contraste forte, o que funciona para hero sections mas mata a leitura de texto em cima. Eu vejo isso todo dia em briefings de clientes que querem "algo vibrante" e depois reclamam que o botão de CTA não aparece.
Se você quer um degrade colorido para usar como background de interface, a regra prática é: luminância máxima de 70% no ponto mais claro e mínima de 25% no mais escuro. Qualquer coisa acima disso compete com o conteúdo. Para arte generativa ou vídeo, aí sim você pode empurrar até 95%. O limite é o output final, não a ferramenta. Outro detalhe que ninguém fala: a direção do degradê importa mais do que as cores. Um degrade vertical com luz vindo de cima parece natural porque imita iluminação ambiente. Horizontal pode funcionar em layouts wide. Angular funciona quando você quer sensaçãodinâmica. Diagonal puro (45 graus) é o que todo mundo usa e todo mundo vê. Se quer se destacar, usa algo entre 30 e 60 graus fora do convencional, tipo 75 ou 110.
👉 Clique no botão abaixo para saber mais sobre o assunto!
Workflow rápido que eu uso hoje
Abre o Photoshop. Cria um documento 1920x1080 em sRGB. Vai em Layer > New Fill Layer > Gradient. No editor de gradiente, coloca três stops. Cor 1: #1a1a2e. Cor 2: #16213e. Cor 3: #0f3460. Move o stop 2 para a posição 35%. Muda a interpolação para spline suave. Clica OK. Salva como PNG-24. Leva 4 minutos. Se quiser textura, adiciona um ruído de 2% em modo Overlay. Para After Effects, o processo é similar mas com Controls. Usa o efeito Linear Gradient ou RADIAL Gradient no CC Services. A vantagem é que você anima o Start Point e End Point ao longo do tempo. Isso cria aquele efeito de luz se movendo que todo mundo acha bonito. Anotação técnica: anima os stops também. Deixa uma cor dominante variar sutilmente. O resultado fica muito mais orgânico do que um degrade estático.
Se você está fazendo isso para print, converte para CMYK antes de finalizar. Degradês em RGB que parecem bonitos na tela frequentemente se quebram na impressão com banding. O workaround é adicionar uma camada de ruído quase imperceptível (1-2%) ou usar dithering no momento da exportação. Na Adobe, isso fica em Image > Mode > Duotone com configuração de dispersão. Em software gratuito, o Krita tem dithering nativo nas exportações. Recursos gratuitos para paletas: Coolors.co, Paletton.com, e oAdobe Color. Mas o melhor reference que eu encontrei foi o site de um estúdio japonês de design que mostra degradês de luz natural capturados em fotos de céu. Copiar a estrutura de cor de fotos reais evita aquele look "digital" que todo mundo tenta fugir e acaba conseguindo metade do tempo.
Se o seu projeto exige performance — sites com muitos elementos animados, por exemplo — evite gradients CSS complexos com mais de quatro stops. O navegador recalcula a cada frame e em telas HD+ isso pode pesar. Nesses casos, use uma imagem PNG de gradiente pré-renderizada. O ganho é imperceptível em hardware moderno mas faz diferença em dispositivos móveis de entrada. Eu testei isso em um projeto de landing page e a carga inicial caiu de 2.3s para 0.8s só por substituir gradientes CSS por sprites. Última observação: se você trabalha com Premiere Pro ou DaVinci Resolve, o degrade colorido funciona de forma semelhante mas com controles diferentes. No Resolve, o Fusion é onde você tem controle real. No Premiere, o efeito Gradient Ramp é limitado. Se precisa de mais precisão, exporta o sólido do AE e importa como footage. É um passo extra mas evita dor de cabeça com tracking de cor.
O download de presets prontos existe em sites como Motion Array e Envato Elements, mas o preço por preset varia de R$30 a R$200 dependendo do pack. Eu recomendo comprar apenas se você for usar mais de 20 variações. Caso contrário, levar menos de 10 minutos para montar manualmente qualquer preset pago rende um resultado mais adequado ao projeto específico.
