Degradê Dourado

11 degradês de dourado prontos, com o código CSS para copiar: do Dourado Claro ao Fusão de Ouro, dourado com branco e com preto e dourado com as cores que combinam com ele. Passe o mouse no card para ver os códigos de cada cor.

#FFEC8B

#85754E

Dourado Claro para Fusão de Ouro

Do tom mais claro ao mais escuro de dourado.

#FFEC8B

#CFB53B

#DA9100

#85754E

Dourado Tom Sobre Tom

Quatro tons de dourado: Dourado Claro, Ouro Antigo, Dourado Colheita, Fusão de Ouro.

#FFD700

#FFFFFF

Dourado para Branco

Clareia até o branco.

#FFD700

#000000

Dourado para Preto

Escurece até o preto.

#FFEC8B

#FCC200

Dourado Claro para Papoula Dourada

Dourado Claro e Papoula Dourada quase não mudam de claridade: o degradê troca só o matiz.

#FCC200

#DAA520

Papoula Dourada para Dourado-Vara (Goldenrod)

Papoula Dourada e Dourado-Vara (Goldenrod) quase não mudam de claridade: o degradê troca só o matiz.

#DAA520

#B8860B

Dourado-Vara (Goldenrod) para Dourado Escuro

Dourado-Vara (Goldenrod) e Dourado Escuro quase não mudam de claridade: o degradê troca só o matiz.

#FFD700

#EC004F

#000080

Dourado para Azul-Marinho

Com #EC004F no meio: só com as duas pontas, o centro ficaria acinzentado (#806C40).

#FFD700

#006400

Dourado para Verde-Escuro

Dourado com uma das cores que combinam com ele.

#FFD700

#800020

Dourado para Borgonha (Bordô)

Dourado com uma das cores que combinam com ele.

#FFE973

#FFD700

#DAA520

Dourado Radial

Do centro para as bordas, o tom claro no meio.

Códigos CSS dos Degradês de Dourado

Toque na linha para copiar o CSS do degradê dourado.

Degradê	CSS
Dourado Claro para Fusão de Ouro	`linear-gradient(90deg, #FFEC8B 0%, #85754E 100%)`
Dourado Tom Sobre Tom	`linear-gradient(180deg, #FFEC8B 0%, #CFB53B 33%, #DA9100 67%, #85754E 100%)`
Dourado para Branco	`linear-gradient(90deg, #FFD700 0%, #FFFFFF 100%)`
Dourado para Preto	`linear-gradient(180deg, #FFD700 0%, #000000 100%)`
Dourado Claro para Papoula Dourada	`linear-gradient(135deg, #FFEC8B 0%, #FCC200 100%)`
Papoula Dourada para Dourado-Vara (Goldenrod)	`linear-gradient(135deg, #FCC200 0%, #DAA520 100%)`
Dourado-Vara (Goldenrod) para Dourado Escuro	`linear-gradient(135deg, #DAA520 0%, #B8860B 100%)`
Dourado para Azul-Marinho	`linear-gradient(90deg, #FFD700 0%, #EC004F 50%, #000080 100%)`
Dourado para Verde-Escuro	`linear-gradient(90deg, #FFD700 0%, #006400 100%)`
Dourado para Borgonha (Bordô)	`linear-gradient(90deg, #FFD700 0%, #800020 100%)`
Dourado Radial	`radial-gradient(circle at center, #FFE973 0%, #FFD700 50%, #DAA520 100%)`

Como Usar o Degradê Dourado

Os degradês desta página usam 13 tons de dourado com nome, do Dourado Claro (#FFEC8B) ao Fusão de Ouro (#85754E).

No degradê Dourado Claro para Fusão de Ouro, o texto branco só passa de 4,5:1 de contraste (o mínimo para leitura, pela WCAG) a partir de 100% do caminho. Antes disso, use texto preto (17,6:1 na ponta clara) ou deixe o texto do lado escuro.

Em 1 dos degradês com outra cor, o meio feito pelo navegador fica acinzentado: no degradê Dourado para Azul-Marinho, seria #806C40. Nele, uma terceira cor no centro (#EC004F), calculada no espaço LCH, mantém o degradê vivo. Vale o mesmo para qualquer par de cores distantes na roda de cores.

Para outros tons, veja os tons de dourado e as paletas com dourado, com nome e código, ou monte o seu degradê no Criador de Gradiente, que já abre com três tons de dourado. O guia Degradê de cores: como criar um gradiente bonito explica os tipos linear, radial e cônico.