Degradê Vermelho

11 degradês de vermelho prontos, com o código CSS para copiar: do Vermelho Médio ao Sangue de Boi, vermelho com branco e com preto e vermelho com as cores que combinam com ele. Passe o mouse no card para ver os códigos de cada cor.

#E58E73

#4A0000

Vermelho Médio para Sangue de Boi

Do tom mais claro ao mais escuro de vermelho.

#E58E73

#C95A49

#AF4035

#4A0000

Vermelho Tom Sobre Tom

Quatro tons de vermelho: Vermelho Médio, Baú de Cedro, Carmim Médio, Sangue de Boi.

#FF0000

#FFFFFF

Vermelho para Branco

Clareia até o branco.

#FF0000

#000000

Vermelho para Preto

Escurece até o preto.

#E58E73

#CD5C5C

Vermelho Médio para Vermelho-Indiano

O Vermelho Médio é 14 pontos mais claro que o Vermelho-Indiano (L* de 67 contra 53).

#CD5C5C

#CC3336

Vermelho-Indiano para Laca de Garança

Vermelho-Indiano e Laca de Garança quase não mudam de claridade: o degradê troca só o matiz.

#CC3336

#960018

Laca de Garança para Carmim

O Laca de Garança é 16 pontos mais claro que o Carmim (L* de 46 contra 31).

#FF0000

#000080

Vermelho para Azul-Marinho

Vermelho com uma das cores que combinam com ele.

#FF0000

#FFD700

Vermelho para Dourado

Vermelho com uma das cores que combinam com ele.

#FF0000

#F5F5DC

Vermelho para Bege

Vermelho com uma das cores que combinam com ele.

#C09999

#FF0000

#7C4848

Vermelho Radial

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

Códigos CSS dos Degradês de Vermelho

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

Degradê	CSS
Vermelho Médio para Sangue de Boi	`linear-gradient(90deg, #E58E73 0%, #4A0000 100%)`
Vermelho Tom Sobre Tom	`linear-gradient(180deg, #E58E73 0%, #C95A49 33%, #AF4035 67%, #4A0000 100%)`
Vermelho para Branco	`linear-gradient(90deg, #FF0000 0%, #FFFFFF 100%)`
Vermelho para Preto	`linear-gradient(180deg, #FF0000 0%, #000000 100%)`
Vermelho Médio para Vermelho-Indiano	`linear-gradient(135deg, #E58E73 0%, #CD5C5C 100%)`
Vermelho-Indiano para Laca de Garança	`linear-gradient(135deg, #CD5C5C 0%, #CC3336 100%)`
Laca de Garança para Carmim	`linear-gradient(135deg, #CC3336 0%, #960018 100%)`
Vermelho para Azul-Marinho	`linear-gradient(90deg, #FF0000 0%, #000080 100%)`
Vermelho para Dourado	`linear-gradient(90deg, #FF0000 0%, #FFD700 100%)`
Vermelho para Bege	`linear-gradient(90deg, #FF0000 0%, #F5F5DC 100%)`
Vermelho Radial	`radial-gradient(circle at center, #C09999 0%, #FF0000 50%, #7C4848 100%)`

Como Usar o Degradê Vermelho

Os degradês desta página usam 58 tons de vermelho com nome, do Vermelho Médio (#E58E73) ao Sangue de Boi (#4A0000).

No degradê Vermelho Médio para Sangue de Boi, o texto branco só passa de 4,5:1 de contraste (o mínimo para leitura, pela WCAG) a partir de 35% do caminho. Antes disso, use texto preto (8,4:1 na ponta clara) ou deixe o texto do lado escuro.

Nenhum dos pares fica acinzentado no meio: as pontas de cada degradê estão perto na roda de cores ou uma delas é neutra (branco, preto ou cinza). Com cores opostas, como vermelho e a complementar, ponha uma terceira cor no centro.

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