Guia prático: trabalhando com tons de azul petróleo
O azul petróleo não é uma cor única. É uma família que varia do verde-azulado escuro ao azulado quase acinzentado. A maioria das pessoas procura hex codes prontos e cola. Isso funciona na maior parte das tempo, mas gera problemas sérios quando o tom sai da tela. Vou listar os códigos mais úteis logo abaixo. Mas antes, algo que todo mundo esquece: o azul petróleo depende fortemente do contexto onde é aplicado. Num fundo branco, ele parece mais quente. Num fundo escuro, escurece ainda mais e tende a esverdear. Isso não é opinião minha — é como a luz funciona. Já perdi um projeto inteiro porque o cliente imprimiu em papel couchê fosco e o tom ficou completamente errado. A solução foi ajustar para #0F4C5C em vez do #006D77 que eu tinha usado originalmente. O resultado foi mais estável em diferentes superfícies.
tons de azul petroleo
Aqui estão os valores que eu uso com mais frequência. Eles cobrem desde versões mais escuras até as mais claras da paleta: #006D77 — Azul petróleo clássico. Bom para interfaces e branding. É o tom padrão que aparece em muitos sistemas de design.
#0F4C5C — Versão um pouco mais escura. Funciona bem quando você precisa de contraste alto em fundos claros. Eu prefiro esse para textos sobre branco. #2E8B96 — Um meio-termo. Mais vivo, menos soturno. Útil para destaques e CTAs quando o azul petróleo puro fica pesado demais.
#1A5F7A — Tendendo mais para o azul do que para o verde. Bom para materiais corporativos que precisam parecer confiáveis sem parecer frios. #048A81 — A versão mais verde da família. Parece petróleo quando está num fundo claro, mas pode virar turquesa escuro em telas calibradas de forma diferente. Cuidado com isso.
#0B5666 — Quase preto quando pequeno. Só funciona bem em tamanhos grandes ou com espaço generoso ao redor. Em botões pequenos, ele some. #3DC2BE — Versão clara e vibrante. Boa para elementos que precisam se destacar, mas não funciona bem como cor primária. É melhor usar como cor secundária ou de preenchimento em gradientes.
#01796E — Equilibrado entre verde e azul. Esse é o que mais se aproxima do que pintores chamam de teal petróleo tradicional. Recomendo para ilustrações e artes que precisam de um tom orgânico.
👉 Clique no botão abaixo para saber mais sobre o assunto!
Como escolher o tom certo
O erro mais comum é escolher pelo nome ou pela visualização na tela do computador. A tela emite luz; a tinta reflete luz. São mecanismos diferentes. Sempre valide em pelo menos três dispositivos antes de aprovair. Eu uso um monitor calibrated com X-Rite i1Display, mas mesmo assim confio em ver a cor no celular do cliente e numa impressão de teste antes de fechar qualquer projeto. Para web, use sempre a versão com transparência controlada. Azul petróleo puro sobre branco pode cansar a vista em áreas extensas. Ajustar a opacidade para 85% ou adicionar um leve desfoque no fundo melhora a legibilidade sem mudar o tom em si.
Para impressão, o problema é outro. Azul petróleo em CMYK exige uma combinação específica. Se você converter diretamente, o tom fica empastado. A receita que eu uso é aproximadamente: C=75 M=55 Y=40 K=30. Não é universal — depende da gráfica e do papel. Sempre peça uma prova de cor antes de imprimir tiragens grandes. Um detalhe que poucos conhecem: azul petróleo em telas OLED parece mais escuro do que em IPS. Se seu público usa muitos smartphones com tela OLED, considere clarear levemente o tom. Diferença de 3 a 5 pontos no valor RGB já faz perceptível.
Combinações que funcionam
Azul petróleo combina bem com terracota, mostarda, areia e branco gelo. Evita cor-de-rosa forte e vermelho-lima — esses criam vibração excessiva que distrai do tom principal. Uma combinação segura é azul petróleo com bege #F5F0EB e detalhes em cobre #B87333. Serve para identidade visual, interiores e embalagens. Em gradientes, o azul petróleo funciona bem vindo de um cinza azulado (#4A6FA5) até um verde escuro (#1A6B5A). O gradiente precisa ser suave, de preferência em ângulo de 135 graus. Gradientes muito curtos fazem a cor parecer achatada.
Erros frequentes
Usar azul petróleo como cor de texto em fundo branco em tamanhos menores que 14px. O contraste cai e fica ilegível. Use a versão mais clara ou troque por um cinza escuro com toque azul. Aplicar azul petróleo em massa sem variar tonalidade. O resultado é monótono. Introduza variação de 10% a 15% no tom para criar hierarquia visual. Isso se aplica tanto a UI design quanto a composição gráfica.
Confundir azul petróleo com verde-mar ou turquesa. A diferença é sutil mas relevante. Turquesa tem mais azul e menos verde. Verde-mar tem mais verde. O petróleo fica no meio. Se errar na identificação, toda a paleta sai do lugar.
Alternativas
Se azul petróleo não funcionar no seu projeto, considere azul-aço (#4682B4) para algo mais frio e neutro, ou verde-petróleo (#5F9EA0) se quiser mais calor. Ambas as opções são mais previsíveis em diferentes meios e têm mais opções de ferramenta disponíveis.