O azul-marinho é uma cor sofisticada e serena, com sutis tons de roxo que realçam seu senso de luxo e elegância. Este tom profundo e rico está na seção azul-violeta da roda de cores, denotando um tom mais frio. Inclui matizes como azul meia-noite e azul tinta.

O azul-marinho é definido pelos seguintes códigos e valores de cor para garantir consistência em várias plataformas e dispositivos digitais.
- Código HEX: #000080
- Valor RGB: 0% vermelho, 0% verde e 50,2% azul
Considerações de acessibilidade desempenham um papel crucial na escolha de cores no design de UX e UI. Figma oferece plugins na Comunidade para garantir que seus designs atendam às Diretrizes de Acessibilidade de Conteúdo da Web.
Aqui estão algumas maneiras de usar o azul-marinho em seus designs:
- Transmitir autoridade e confiança. Use azul-marinho para elementos que exigem que os usuários sintam uma sensação de confiabilidade e segurança, como telas de login, interfaces de transações financeiras ou aplicativos de saúde e bem-estar. A associação da cor com autoridade e confiabilidade a torna ideal para plataformas onde a confiança é fundamental.
- Aumentar a produtividade e o foco. Aplique azul-marinho em aplicativos relacionados ao trabalho ou estudo, ferramentas de gerenciamento de projetos ou qualquer UI onde a concentração seja essencial. Com efeitos calmantes que ajudam a reduzir o estresse e aumentar o foco, é perfeito para fundos de painéis ou barras de menu.
- Criar uma estética profissional. A elegância e sofisticação do azul-marinho se adaptam bem a sites de redes profissionais, sites corporativos ou plataformas de serviços premium. Use-o para cabeçalhos, rodapés e elementos-chave de UI para elevar o design geral.
- Equilibrar com cores complementares. Combine azul-marinho com tons mais quentes como coral, creme ou dourado para um esquema de cores equilibrado e atraente. Essa abordagem pode adicionar vivacidade ao design, fazendo com que botões de chamada para ação ou destaques se destaquem sem sobrecarregar o usuário.
Lembre-se de que a cor e seu significado podem mudar de cultura para cultura — e a qualquer momento. Se você estiver projetando para um público global, pesquise considerações de cor para suas regiões específicas.
Para variações dentro do mesmo espectro profundo e autoritário do azul-marinho, considere:
- Azul escuro (#191970) é ligeiramente mais escuro, lembrando o céu à meia-noite, oferecendo uma profundidade semelhante ao azul-marinho.
- Azul real (#305CDE) introduz uma qualidade mais vibrante e luminosa, mantendo a essência digna do azul-marinho.
- Índigo (#560591) mescla o azul profundo do azul-marinho com um toque de violeta, apresentando uma alternativa mística e introspectiva.
- Azul prussiano (#003153) oferece um toque mais verde, resultando em um tom que é ao mesmo tempo imponente e ligeiramente mais suave que o azul-marinho.
Para complementar os tons profundos do azul-marinho, considere combiná-lo com:
- Branco (#FFFFFF) proporciona um contraste nítido e limpo que destaca a sofisticação do azul-marinho.
- Dourado (#EFBF04) adiciona um toque luxuoso, criando uma paleta régia e refinada quando combinado com azul-marinho.
- Bege quente (#F5F5DC) introduz um equilíbrio neutro e terroso que suaviza a intensidade do azul-marinho sem diminuir sua elegância.
- Cinza frio (#CBCBCB) oferece um fundo moderno e discreto que permite que o azul-marinho se destaque em um ambiente contemporâneo.
- Coral (#FF7F50) traz um contraste vibrante e animado, infundindo energia na calma composta do azul-marinho.
Outras cores que valem a pena considerar incluem verde sálvia para um visual natural e harmonioso; prata para um toque moderno e elegante; e laranja queimado para uma vibração ousada e outonal.
Embora o azul-marinho seja versátil, ele pode entrar em conflito com:
- Verde brilhante (#00FF00) pode ser muito vibrante e pode desviar da elegância sutil do azul-marinho, criando um efeito visual chocante.
- Rosa neon (#FF1493) apresenta um contraste excessivamente brilhante que pode sobrecarregar a sofisticação natural do azul-marinho.
- Azul elétrico (#7DF9FF), com sua alta intensidade, pode competir com a profundidade do azul-marinho, levando a uma experiência visual discordante.
- Roxo (#800080), embora rico, pode criar uma paleta pesada quando combinado com azul-marinho, potencialmente levando a uma atmosfera sombria.
- Amarelo limão (#CCFF00), com seu tom brilhante e ácido, pode perturbar a harmonia do azul-marinho, levando a um equilíbrio conflitante e desconfortável.
O azul-marinho é comumente associado à autoridade e profissionalismo. Ele transmite estabilidade, confiabilidade e sofisticação. Esta cor frequentemente representa profundidade e expertise.
Na psicologia das cores, acredita-se que o azul-marinho promove clareza mental e concentração. É considerado uma cor de intelecto, sabedoria e poder. O tom profundo de azul tem um efeito calmante que pode ajudar a focar pensamentos, reduzir o estresse e aumentar a produtividade.
O azul-marinho é uma escolha popular no design de UI/UX, particularmente para branding corporativo e plataformas educacionais. É frequentemente usado para comunicar confiabilidade e profissionalismo. No design digital, o azul-marinho pode ser usado como uma cor de marca para estabelecer uma base sólida ou como uma cor de destaque para realçar características-chave. Ele combina bem com muitas outras cores, proporcionando contraste e interesse visual enquanto mantém um ar de formalidade e elegância.
O azul-marinho tem uma rica história que remonta a 1748, quando foi deliberadamente escolhido para os uniformes da Marinha Real Britânica. A decisão foi baseada em suas propriedades de resistência à cor e praticidade em camuflar sujeira e desgaste, tornando-o uma escolha ideal para longas jornadas oceânicas. A adoção do azul-marinho pela Marinha Real estabeleceu sua forte associação com autoridade marítima e disciplina e levou outras marinhas ao redor do mundo a adotarem esquemas de cores semelhantes.
Até o século 20, o azul-marinho fez a transição de uma cor marítima para um item básico nos guarda-roupas civis. A cor simbolizava elegância discreta na moda, vestuário de negócios e até mesmo no design de interiores. Ela equilibra suas origens na utilidade naval com um apelo moderno de sofisticação, tornando-se uma cor versátil que resistiu ao teste do tempo. O azul-marinho continua a ser reverenciado por sua profundidade e versatilidade, unindo a tradição ao design contemporâneo.
Variações de cor
Sombras
Tonalidades
Tons
Matizes
Harmonias de cores
Complementar
Dividida
Monocromática
Análoga
Triádica
Quadrado
Paletas personalizadas
Azuis Obsidianos
Brilho Noturno
Mancha de Tinta
Verificador de contraste
Contraste 16,01
- Texto grande
#000080
- Texto normal
Seu jeito de criar, alinhar e montar é importante. Faça tudo com o Figma.
| Categoria | ||
|---|---|---|
Aprovado | Aprovado | |
Aprovado | Aprovado | |
Aprovado | Aprovado |
Contraste 1,31
- Texto grande
#000080
- Texto normal
Seu jeito de criar, alinhar e montar é importante. Faça tudo com o Figma.
| Categoria | ||
|---|---|---|
Reprovado | Reprovado | |
Reprovado | Reprovado | |
Reprovado | Reprovado |
Simulações de cor
Protanopia
Deuteranopia
Tritanopia
Acromatopsia
A cor hexadecimal #000080, conhecida como azul-marinho, tem valores RGB de R:0, G:0, B:128 e valores CMYK de C:100, M:100, Y:0, K:50.
| VALUE | CSS | |
|---|---|---|
| HEX | #000080 | #000080 |
| RGB DECIMAL | 0, 0, 128 | RGB(0,0,128) |
| RGB PERCENTAGE | 0.0, 0.0, 50.2 | RGB(0.0%,0.0%,50.2%) |
| CMYK | 100, 100, 0, 50 | |
| HSL | HSL(240.0, 100.0%, 25.1%) | HSL(240.0, 100.0%, 25.1%) |
| HSV (OR HSB) | 240.0°, 100.0, 50.2 | |
| WEB SAFE | #00153 | #00153 |
| BINARY | 00000000, 00000000, 10000000 | |
| iOS - SwiftUI | Color(red: 0.000, green: 0.000, blue: 0.502) | |
| iOS - UIKit | UIColor(red: 0.000, green: 0.000, blue: 0.502, alpha: 1) | |
| Android - Compose | Color(0xFF000080) |


