Azul é uma das cores mais comuns usadas em web design. Usar um azul médio a escuro estimula uma sensação relaxante que os designers podem complementar com amarelo e laranja.
Aqui estão algumas maneiras diferentes de o azul trabalhar com outras cores.
Opostos se atraem e azul combina com laranja
Considere combinar as cores azul com laranja em um esquema de cores complementares.
Do mais escuro ao mais claro, as laranjas mostradas com cada amostra de azul na imagem acima são:
- Hex FFA500 | RGB 255, 165, 0 (um laranja dourado; palavra-chave de cor SVG e palavra-chave de cor CSS laranja)
- Hex FF8000 | RGB 255, 128, 0 (laranja médio)
- Hex FF4500 | RGB 255, 69, 0 (vermelho laranja; palavra-chave de cor SVG orangered)
- Hex C83200 | RGB 200, 50, 0 (laranja escuro)
- Números: Hex FF7F27 | RGB 255, 127, 39 (uma laranja pêssego)
Os azuis, do mais escuro ao mais claro são:
- Marinha: Hex 000080 | RGB 0, 0, 128 (palavra-chave de cor CSS/palavra-chave de cor SVG navy)
- Azul: Hex 0000FF | RGB 0, 0, 255 (palavra-chave de cor CSS/SVG é azul; cor segura para navegador)
- Hex: 0045FF | RGB 0, 69, 255 (um azul médio)
- Azul Aço: Hex 4682B4 | RGB 70, 130, 180 (palavra-chave de cor SVG steelblue; um azul corporativo)
- Hex: 0080FF | RGB 0, 128, 255 (um azul médio)
- Azul claro: Hex ADD8E6 | RGB 173, 216, 230 (palavra-chave de cor SVG azul claro)
Azul escuro e tons médios de azul simbolizam importância, confiança, poder, inteligência, estabilidade, unidade e conservadorismo. Ao adicionar um pouco de laranja à sua paleta predominantemente azul escura, você introduz um pouco de calor e energia que podem evitar que sua paleta seja muito empolada ou avassaladora.
Você não precisa usar esses tons exatos. Fique um pouco mais claro ou mais escuro, ou dê um passo para a esquerda ou para a direita na roda de cores. Essas combinações de cores ajudam você a encontrar uma paleta de cores adequada usando azul e laranja como componentes principais.
Misture Deep Blues com Golden Yellow
Tome os azuis escuros quase roxos e adicione um toque de amarelo-sol em um esquema de cores complementares.
Azul é uma cor fria movendo-se para quente à medida que você adiciona os tons arroxeados, enquanto o amarelo é uma cor quente do outro lado da roda de cores. Para evitar vibrações desagradáveis, evite usar em quantidades iguais. Dê vida ao seu azul com um toque de amarelo (ou acalme seu amarelo com um toque de azul).
Do mais escuro ao mais claro, o amarelo mostrado com cada amostra de azul na imagem acima é:
- Amarelo de Cádio: Hex FF9912 | RGB 255, 153, 18 (um amarelo acastanhado quente)
- Ouro: Hex FFD700 | RGB 255, 215, 0 (palavra-chave de cor SVG gold)
- Números: Hex FFFF00 | RGB 255, 255, 0 (palavra-chave de cor SVG/CSS amarelo)
Os azuis são:
- Very Dark Blue: Hex 000033 | RGB 0, 0, 51 (azul escuro seguro para navegador)
- Midnight Blue: Hex 191970 | RGB 25, 25, 112 (palavra-chave de cor SVG meia-noiteblue)
- Dark Slate Blue: Hex 483D8B RGB 72, 61, 139 (palavra-chave de cor SVG darkslateblue; um azul acinzentado-roxo)
- Indigo: Hex 4B0082 | RGB 75, 0, 130 (palavra-chave de cor SVG índigo; um azul arroxeado)
- Azul Violeta: Hex 8A2BE2 | RGB 138, 43, 226 (palavra-chave de cor SVG azul violeta)
- Azul Cob alto: Hex 3D59AB | RGB 61, 89, 171
Cores que empurram para o lado violeta-púrpura do azul podem adicionar um toque de mistério, toques de feminilidade. Acrescenta calor ao azul frio.
Tons de ciano com laranja escuro
Ciano médio a escuro é azul quase verde. Aqui, vários tons de azul médio e ciano são combinados com cores laranja acastanhadas escuras.
Além de seus atributos calmantes, esse tom mais escuro de azul pode carregar o simbolismo do verde, como equilíbrio, harmonia e estabilidade. Recebe um pouco de calor e energia quando combinado com tons acastanhados ou avermelhados de laranja. O marrom é uma cor neutra natural e realista. Vermelho e ciano são opostos na roda de cores com alto contraste, mas não são necessariamente uma ótima combinação. Mudar de vermelho para laranja e azuis mais escuros proporciona uma paleta mais agradável.
Do mais escuro ao mais claro, o vermelho-laranja mostrado com cada amostra azul na imagem acima são:
- Vermelho Laranja Profundo: Hex CD3700 | RGB 205, 55, 0
- Laranja de Cádmio: Hex FF6103 | RGB 255, 97, 3
- Números: Vermelho Hex FF0000 | RGB 255, 0, 0 (palavra-chave de cor SVG/CSS vermelho)
Os azuis são:
- Azul Real Escuro: Hex 27408B | RGB 39, 64, 139
- Deep Sky Blue: Hex 00688B | RGB 0, 104, 139 (not palavra-chave de cor deepskyblue)
- Dark Slate Blue: Hex 2F4F4F RGB 47, 79, 79 (not palavra-chave de cor darkslateblue)
- Ciano Escuro: Hex 008B8B | RGB 0, 139, 139 (o lado mais verde do azul)
- Manganês Azul: Hex 03A89E | RGB 3, 168, 158 (uma cor azul turquesa)
- Cyan (Aqua): Hex 00FFFF | RGB 0, 255, 255 (palavra-chave de cor SVG cyan ou aqua; uma cor azul-esverdeada)
Azul, Vermelho e Amarelo
Uma tríade complementar dividida pega uma cor (neste caso, azul) e então pega as cores de cada lado do complemento dessa cor (cor oposta na roda de cores). O complemento do azul puro é o amarelo puro. O azul médio é oposto ao laranja. Dependendo do tom de azul com o qual você começa e de quantas cores intermediárias você passa, você pode combiná-lo com cores de vermelho-rosado a verde-amarelo.
- Marinha: Hex 000080 | RGB 0, 0, 128
- Vermelho brilhante: Hex FE0004 | RGB 254, 0, 4
- Amarelo ensolarado: Hex FFFB00 | RGB 255, 251, 0
- Dark Slate Blue: Hex 483D8B RGB 72, 61, 139 (palavra-chave de cor SVG dark slate blue; um azul acinzentado-roxo)
- Ouro: Hex FFD700 | RGB 255, 215, 0 (palavra-chave de cor SVG gold)
- Chartreuse: Hex 7FFF00 | RGB 127, 255, 0
- Ciano Escuro: Hex 008B8B | RGB 0, 139, 139 (o lado mais verde do azul)
- Violet-Red: Hex D02090 | RGB 208, 32, 144
- Laranja Escura: Hex C83200 | RGB 200, 50, 0 (not palavra-chave de cor laranja escuro)
Os tons mais escuros de azul denotam importância, confiança, poder, autoridade, inteligência, estabilidade, unidade e conservadorismo. O vermelho é outra cor poderosa, mas chama mais a atenção do que o azul. Amarelo adiciona um pouco de brilho e alegria. Usar quantidades iguais de cada cor o tornaria infantil (pense em cores primárias), como o exemplo 1. No entanto, se você usar apenas pequenas doses de vermelho e amarelo (ou cores próximas) com um esquema de cores principalmente azul escuro, é bastante adequado para projetos adultos que você não deseja que pareça muito sério.
