Degradê Salmão

10 degradês de salmão prontos, com o código CSS para copiar: do Tangerina Vívida ao Terracota, salmão com branco e com preto e salmão com as cores que combinam com ele. Passe o mouse no card para ver os códigos de cada cor.

#FFA089

#E2725B

Tangerina Vívida para Terracota

Do tom mais claro ao mais escuro de salmão.

#FFA089

#F88379

#F08080

#E2725B

Salmão Tom Sobre Tom

Quatro tons de salmão: Tangerina Vívida, Rosa Coral, Coral Claro, Terracota.

#FA8072

#FFFFFF

Salmão para Branco

Clareia até o branco.

#FA8072

#000000

Salmão para Preto

Escurece até o preto.

#FFA089

#F88379

Tangerina Vívida para Rosa Coral

Tangerina Vívida e Rosa Coral quase não mudam de claridade: o degradê troca só o matiz.

#FA8072

#E97451

Salmão para Siena Queimado

Salmão e Siena Queimado quase não mudam de claridade: o degradê troca só o matiz.

#FA8072

#000080

Salmão para Azul-Marinho

Salmão com uma das cores que combinam com ele.

#FA8072

#EAC053

#98FF98

Salmão para Verde-Menta

Com #EAC053 no meio: só com as duas pontas, o centro ficaria acinzentado (#C9C085).

#FA8072

#B6BD5F

#40E0D0

Salmão para Turquesa

Com #B6BD5F no meio: só com as duas pontas, o centro ficaria acinzentado (#9DB0A1).

#FCB9B1

#FA8072

#8A463F

Salmão Radial

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

Códigos CSS dos Degradês de Salmão

Toque na linha para copiar o CSS do degradê salmão.

Degradê	CSS
Tangerina Vívida para Terracota	`linear-gradient(90deg, #FFA089 0%, #E2725B 100%)`
Salmão Tom Sobre Tom	`linear-gradient(180deg, #FFA089 0%, #F88379 33%, #F08080 67%, #E2725B 100%)`
Salmão para Branco	`linear-gradient(90deg, #FA8072 0%, #FFFFFF 100%)`
Salmão para Preto	`linear-gradient(180deg, #FA8072 0%, #000000 100%)`
Tangerina Vívida para Rosa Coral	`linear-gradient(135deg, #FFA089 0%, #F88379 100%)`
Salmão para Siena Queimado	`linear-gradient(135deg, #FA8072 0%, #E97451 100%)`
Salmão para Azul-Marinho	`linear-gradient(90deg, #FA8072 0%, #000080 100%)`
Salmão para Verde-Menta	`linear-gradient(90deg, #FA8072 0%, #EAC053 50%, #98FF98 100%)`
Salmão para Turquesa	`linear-gradient(90deg, #FA8072 0%, #B6BD5F 50%, #40E0D0 100%)`
Salmão Radial	`radial-gradient(circle at center, #FCB9B1 0%, #FA8072 50%, #8A463F 100%)`

Como Usar o Degradê Salmão

O site tem 3 tons de salmão com nome; para os degradês, entram também cores próximas, como Vermelho Médio (#E58E73) e Rosa Coral (#F88379). Vão do Tangerina Vívida (#FFA089) ao Terracota (#E2725B).

No degradê Tangerina Vívida para Terracota, o texto branco não chega a 4,5:1 (o mínimo para leitura, pela WCAG) em nenhum ponto; o máximo é 3,1:1, na ponta escura. Use texto preto, que tem 10,6:1 na ponta clara, ou ponha o texto numa faixa sólida.

Em 2 dos degradês com outra cor, o meio feito pelo navegador fica acinzentado: no degradê Salmão para Verde-Menta, seria #C9C085. Neles, uma terceira cor no centro (no primeiro, #EAC053), 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 salmão, com nome e código, ou monte o seu degradê no Criador de Gradiente, que já abre com três tons de salmão. O guia Degradê de cores: como criar um gradiente bonito explica os tipos linear, radial e cônico.