Cor Dourado

Dourado é a cor do ouro: um amarelo quente e saturado. Na web, o tom padrão é o #FFD700, o “gold” do CSS; para um efeito metálico, use o #D3AF37. Abaixo, todos os tons de dourado.

Tons de Dourado Com Nome (13)

Tons Claros (2)

Tons Médios (11)

Tabela com os códigos e o contraste dos tons de dourado
Nome HEX RGB Com texto branco Com texto preto
Dourado-Pálido #EEE8AA 238, 232, 170 1,3:1 16,8:1 (AA)
Dourado Claro #FFEC8B 255, 236, 139 1,2:1 17,6:1 (AA)
Ouro Vegas #C5B358 197, 179, 88 2,1:1 10,0:1 (AA)
Ouro Cassino #C79448 199, 148, 72 2,7:1 7,8:1 (AA)
Ouro Antigo #CFB53B 207, 181, 59 2,0:1 10,3:1 (AA)
Dourado Metálico #D3AF37 211, 175, 55 2,1:1 10,0:1 (AA)
Dourado #FFD700 255, 215, 0 1,4:1 15,0:1 (AA)
Dourado-Vara (Goldenrod) #DAA520 218, 165, 32 2,2:1 9,4:1 (AA)
Papoula Dourada #FCC200 252, 194, 0 1,6:1 12,9:1 (AA)
Dourado Colheita #DA9100 218, 145, 0 2,6:1 8,0:1 (AA)
Dourado Metálico Escuro #9C7C38 156, 124, 56 3,9:1 5,4:1 (AA)
Fusão de Ouro #85754E 133, 117, 78 4,5:1 (AA) 4,7:1 (AA)
Dourado Escuro #B8860B 184, 134, 11 3,3:1 6,5:1 (AA)

AA: um texto de tamanho normal fica legível sobre o tom (contraste de 4,5:1 ou mais, pela regra da WCAG).

Tons Parecidos Com Dourado

Cores com nome de outras famílias que ficam perto deste tom, da mais parecida para a menos.

Significado da Cor Dourado

O dourado é a cor do ouro e carrega o que o metal representa: riqueza, prestígio, conquista e celebração. É a cor das medalhas de primeiro lugar, dos troféus, das molduras e dos detalhes de luxo, e aparece nas festas de fim de ano, nas formaturas e nas bodas de ouro, que marcam 50 anos de casamento. Em muitas tradições religiosas, o dourado está ligado ao sagrado e à luz.

Na tela, o dourado não brilha como o metal: é um amarelo quente e saturado, como o Dourado (#FFD700). Os tons mais escuros e menos saturados, como o Dourado Metálico (#D3AF37) e o Ouro Antigo (#CFB53B), lembram ouro envelhecido e soam mais sóbrios; os claros, como o Dourado-Pálido (#EEE8AA), ficam suaves, perto do champanhe.

Os significados mudam com a cultura e o contexto. Veja mais no guia Psicologia das cores.

Onde Usar a Cor Dourado

Decoração. O dourado aparece em metais: luminárias, puxadores, pés de móveis, molduras e espelhos. Em pequenas doses, ilumina ambientes com verde-escuro, azul-marinho, preto ou branco; em excesso, pesa.

Moda. É cor de festa e de acessório: brincos, cintos, bolsas e detalhes de bordado.

Marcas e web. Aparece em joalherias, premiações, bebidas e produtos que querem parecer valiosos. Na tela, o dourado funciona melhor sobre fundos escuros: o Dourado (#FFD700) sobre branco tem só 1,4:1 de contraste, mas sobre preto chega a 15,0:1. Para um efeito mais parecido com o metal, use um gradiente do dourado claro para o escuro no criador de gradiente.

Cores Que Combinam Com Dourado

O dourado combina com cores escuras e profundas, que o fazem brilhar: preto (luxo), azul-marinho (elegância), verde-escuro (clássico) e vinho ou bordô (festa). Com branco, fica limpo; com rosa-claro, delicado. O que pede cuidado é o dourado ao lado do amarelo puro, que o faz parecer apagado, e a mistura de dourado e prata, que só funciona quando é intencional.

Combinam bem:

Pedem cuidado:

O porquê de cada par, combinações de três cores e as harmonias da roda estão em Cores Que Combinam Com Dourado.

Para as regras que valem para qualquer cor, veja os guias Como combinar cores e Cores quentes e frias.

Paletas Com Dourado

#7C6A0A
#BABD8D
#FFDAC6
#FA9500
#EB6424
#A57C00
#B78700
#C99200
#DB9D00
#EDA800
#FFB300
#937416
#B29433
#DAC471
#FFFDB8
#E2BF4E
#CBA135
#FFD300
#FCD12A
#FFC30B
#FFBF00
#DAA520
#A67C00
#BF9B30
#FFBF00
#FFCF40
#FFDC73

Todas as paletas com dourado

Para chegar a um tom de dourado com tinta, veja a tabela de mistura no guia Como Fazer Cores Misturando Tintas (Com Tabela).

Para fundos e banners, veja os degradês de dourado, com o código CSS de cada um: Degradê Dourado.

Exportar Paleta

Exportar Paleta como PDF

Exportar Paleta como Imagem

CSS


			

SVG


			

Código


			

Exportar Código Tailwind


			

Incorpore Esta Paleta

Copie e cole este código onde você deseja que o widget da paleta apareça.