Cor Coral: código #FF7F50

Coral

#FF7F50

Códigos da cor

  • HEX#FF7F50
  • RGBrgb(255, 127, 80)
  • HSLhsl(16, 100%, 66%)
  • HSVhsv(16, 69%, 100%)
  • CMYKcmyk(0%, 50%, 69%, 0%)
  • LABlab(67.3% 45.4 47.5)
  • OKLCHoklch(73.5% 0.168 40.3)

Sobre a cor Coral

Coral tem o código HEX #FF7F50, que corresponde a rgb(255, 127, 80) no modelo RGB. No círculo cromático, seu matiz fica em 16°, com 100% de saturação e 66% de luminosidade (hsl(16, 100%, 66%)).

Pelo matiz, é percebida como uma cor quente: tende a transmitir energia e proximidade e a “avançar” visualmente na composição.

Como fundo, pede texto escuro: o preto atinge contraste de 8,40:1 sobre ela, contra 2,49:1 do branco.

Para impressão, a conversão aproximada é cmyk(0%, 50%, 69%, 0%). Confirme sempre com o perfil de cor da gráfica, porque o resultado depende do papel e da tinta.

Tons mais claros

Tons mais escuros

Combinações com Coral

Complementar

#FF7F50 · #52D1FF

Análoga

#FF527A · #FF7F50 · #FFD752

Tríade

#FF7F50 · #52FF80 · #8052FF

Tetrádica

#FF7F50 · #7AFF52 · #52D1FF · #D752FF

Complementar dividida

#FF7F50 · #52FFD7 · #527AFF

Monocromática

#D13800 · #FF5A1F · #FF7F50 · #FFB89E · #FFF0EB

Coral com texto branco e preto

Texto branco Aa Bb Cc 123
2,49:1 · não passa na WCAG
Texto preto Aa Bb Cc 123
8,40:1 · AAA

Testar outras combinações no verificador de contraste

O coral (#FF7F50, rgb(255, 127, 80)) é um laranja rosado, luminoso e quente, batizado a partir dos corais marinhos. É também uma das cores nomeadas do CSS: color: coral; produz exatamente esse tom. Em 2019, uma variação próxima, o Pantone 16-1546 Living Coral, foi escolhida como Cor do Ano pela Pantone, o que ajudou a popularizar o tom em moda, decoração e interfaces.

Leitura e associações

O coral costuma soar alegre, sociável e acolhedor, com um pé no verão e no litoral. Tem a energia do laranja, mas suavizada pelo rosa, o que o torna menos agressivo que o vermelho e mais maduro que o rosa claro. Em contextos de conservação ambiental, também lembra os recifes e sua fragilidade. São leituras frequentes no Ocidente, e não regras: o significado final depende do público e do que acompanha a cor.

Coral × salmão

São vizinhos no círculo cromático, mas não iguais. O coral tem mais laranja e menos azul (B = 80); o salmão (#FA8072) tem mais azul (B = 114), o que o deixa mais rosado e um pouco mais suave. Na prática, o coral “acende” uma composição; o salmão a aquece com delicadeza. Os dois têm quase a mesma luminância, por isso o contraste com branco e preto é praticamente idêntico.

Aplicações

Em UI, o coral funciona bem em botões de ação secundária, ilustrações e estados de destaque, especialmente em apps de estilo de vida, viagem e comida. Em moda de praia e peças de verão, valoriza peles bronzeadas e morenas. Na decoração, entra em almofadas, louças e quadros, sem precisar tomar a parede inteira.

Combinações que dão certo: turquesa (#40E0D0), o par tropical clássico; azul-marinho (#000080), para um visual náutico; off-white (#FAF9F6), que dá leveza; e mostarda (#FFDB58), para uma paleta retrô.

Dica de acessibilidade

Texto branco sobre coral tem contraste de apenas 2,5:1, abaixo até do mínimo para texto grande. Use texto escuro (8,4:1 com preto) ou, se a marca exige texto branco, escureça o fundo para algo como #B8481F, que passa de 5:1. Teste no verificador de contraste.

Como usar em CSS

:root {
  --color-coral: #FF7F50;
  --color-coral-rgb: 255, 127, 80;
}

.elemento {
  background-color: var(--color-coral);
  color: #000000;
}

Cores parecidas

Use Coral nas ferramentas