Coral color: hex codes, shades and palettes

Palettes built around coral. Click any swatch to copy its hex code.

Coral is the warm pink-orange of the reef it is named after — orange with enough pink in it to feel soft rather than loud. The CSS keyword coral is #FF7F50.

Coral hex, RGB, HSL and OKLCH

#FF7F50
HEX
#FF7F50
RGB
rgb(255, 127, 80)
HSL
hsl(16, 100%, 66%)
OKLCH
oklch(73.5% 0.168 40.2)
On white
2.50:1
On black
8.40:1

Shades of coral

Eleven steps from one base color, generated in OKLCH so each step is an equal perceived step rather than an equal numeric one. Click a swatch to copy it.

Named shades and close relatives

Coral vs salmon vs peach

All three are warm and pale enough to be mistaken for one another, and the difference is mostly where they sit between orange and pink. Coral is at hue 16 and fully saturated: the most orange of the three and the most vivid. Salmon sits at hue 6, closer to pink, and is slightly muted — it reads as fleshier and softer. Peach is paler than both, high in lightness and low in saturation, which puts it in pastel territory rather than accent territory.

A quick test: if it could plausibly be a background, it is peach. If it reads as pink before it reads as orange, it is salmon. If it jumps forward as an accent, it is coral.

Using coral in a palette

Coral is unusually easy to build around, which is why it recurs in branding. Teal is the classic pairing — close to its complement, and the cool-against-warm contrast is strong without either color fighting the other. Navy gives a more restrained version of the same idea. Against cream or sand it goes quiet and becomes almost a neutral warm tone.

It suits hospitality, travel, food, beauty and anything summery. The failure mode is pairing it with another warm mid-tone: coral beside a similar orange or pink looks like an accident rather than a decision.

Contrast and readability

Coral on white measures 2.50:1 and on black 8.40:1. WCAG AA asks for 4.5:1 on normal text and 3:1 on large text and UI components, so the higher of those two decides which background it belongs on. In the scale above, 500 is the first to clear 4.5:1 on white, at 5.67:1.

The contrast checker reports every level for a given pair and suggests the nearest passing shade on the same hue. The color picker builds this same scale from any color you paste in.

Coral color questions

What is the hex code for coral?
Coral is #FF7F50, the CSS named color. In RGB that is rgb(255, 127, 80) and in HSL hsl(16, 100%, 66%) — a fully saturated orange-red at high lightness.
What is the difference between coral and salmon?
Coral sits at hue 16 and is fully saturated, so it leans orange and reads as vivid. Salmon sits nearer hue 6 and is slightly less saturated, so it leans pink and reads as softer.
What color goes best with coral?
Teal is the standard answer and it earns it — close to coral's complement, so the contrast is strong while the two stay balanced. Navy is a calmer alternative, and cream or sand let coral sit as a warm neutral.
Is coral pink or orange?
Orange, with pink in it. At hue 16 it sits in the orange-red range, but the high lightness and full saturation give it the softness people read as pink.

Related colors:orange, peach, amber, rust, terracotta. See every shade on the colors index.