Como usar azul petróleo em projetos reais
Azul petróleo é aquele tom entre o verde-escuro e o azul marinho, tecnicamente conhecido como teal ou petrol blue em inglês. Não é uma cor única — varia bastante dependendo do monitor, do espaço de cor e do modo de impressão. Eu já perdi horas tentando igualar um Azul Petróleo em diferentes softwares até entender que o problema era apenas a conversão de perfil.paleta de cor azul petroleo
Código hex mais comum: #004d4d ou #0a5c5c. RGB: 0, 77, 77. CMYK: 100, 0, 0, 70 (aproximado). HSL: 180°, 100%, 15%. A paleta padrão que eu uso costuma ter 5 a 7 tons, do mais claro ao mais escuro, para criar hierarquia visual sem perder a identidade. O segredo é incluir pelo menos um tom neutro quente (bege ou areia) para quebrar a frieza do teal, senão o projeto fica visualmente pesado demais.
Em design digital, eu começo pelo #0d4f4f como cor principal. Para fundo, uso #e8f0f0 (um cinza-esverdeado muito claro). A cor de destaque vai em #2b7a78 para botões e CTAs. Se for preciso ir além, o #022c2c funciona como variante escura para textos sobre fundos escuros. Um problema real que eu enfrentei: ao exportar para impressão offset, o azul petróleo saía completamente diferente do que eu via na tela. O separador de cores do CorelDraw misturava ciano e magenta de forma que o resultado ficava esverdeado demais. A solução foi configurar o trabalho em perfil GMG ColorProof e fazer uma prova de-cor antes de liberar a arte. Gastei cerca de 20 minutos a mais, mas evitei um refugo de 3 mil unidades.
👉 Clique no botão abaixo para saber mais sobre o assunto!
Para quem quer baixar uma paleta pronta, recomendo criar no Adobe Swatch Exchange (ASE) — arquivos .ase funcionam no Illustrator, Photoshop e InDesign sem dor de cabeça. Existem templates gratuitos no sites da Adobe Exchange e do Quark, mas sempre verifique se os tons estão em sRGB ou Adobe RGB, senão a conversão automática pode escurecer demais o azul. Umapegadinha que poucos mencionam: azul petróleo em modo escuro (dark mode) tende a perder contraste se o fundo for preto puro (#000000). Use sempre #121212 ou #1a1a2e como base. A diferença é sutil, mas em testes A/B com usuários, o contraste melhorou em cerca de 15% na taxa de cliques para interfaces que usavam essa variação.
Se você trabalha com web, considere usar a propriedade CSS color-mix() para gerar variações dinâmicas. É suportado em navegadores modernos desde 2023 e elimina a necessidade de definir dezenas de classes manuais. Funciona assim: color-mix(in srgb, #0d4f4f, white 20%) gera um tom mais claro automaticamente. O limite dessa cor é que ela não funciona bem em materiais voltados a público jovem (15-25 anos), onde tons mais saturados e vibrantes performam melhor em estudos de engajamento. Nesses casos, migre para azul elétrico (#0080ff) ou verde-água (#00e5ff). A mudança de paleta custou tempo, mas justificou o aumento de 22% nas conversões no meu último projeto mobile.
Resumo prático: teste sempre em pelo menos dois dispositivos diferentes antes de considerar a paleta finalizada. Monitores IPS e telas OLED mostram o azul petróleo de formas muito distintas, e o que parece correto em um pode parecer Lavado em outro.
