Orange family
Coral color
A light, bright orange leaning red. The reference coral is #FF7F50, as defined by the CSS named color.
| HEX | #FF7F50 | |
|---|---|---|
| RGB | rgb(255, 127, 80) | |
| HSL | hsl(16, 100%, 66%) | |
| HSV | hsv(16, 69%, 100%) | |
| OKLCH | oklch(73.5% 0.168 40.2) | |
| CMYK* | 0, 50, 69, 0 |
* CMYK is a simple conversion without a print profile; ask your printer for exact values.
What color is coral?
Coral is a pinkish orange named after the red and pink coral skeletons used in jewellery. The CSS coral, #FF7F50, is a bright, warm shade; the coral in the xkcd survey is redder. It sits between salmon and orange and is a popular accent colour in summer palettes.
Coral hex codes by source
Color names are not standardized, so the same name can point to different colors. Here is every definition of coral in our three sources, with how close each one is to the reference.
| Name | HEX | Source | Compared with the reference |
|---|---|---|---|
| Coral | #FF7F50 | CSS named color | Reference shown on this page |
| Coral | #FC5A50 | xkcd Color Survey | Noticeably different · 70% similar |
| Coral | #FF7F50 | Color Names (meodai) | Same color |
Coral vs Salmon
#FF7F50
#FA8072
Salmon is pinker and softer; coral is more orange and saturated. In numbers: the two are 85% similar (OKLab distance 0.038). See Salmon for its own codes.
Colors similar to coral
The closest named colors to #FF7F50 across all three sources, with their similarity in OKLab.
Tints and shades of coral
The same hue from light to dark, generated in OKLab so the steps look even. Click a step to copy its HEX code.
Colors that go with coral
Classic color-wheel combinations built on #FF7F50, computed in OKLCH so the partners keep the same lightness and intensity. Each swatch shows the nearest common name.
Complementary
Analogous
Triadic
Split complementary
Coral with white and black text
WCAG asks for a contrast of at least 4.5:1 for body text (AA) and 3:1 for large text. On a coral background, black text is the better choice.
Use coral in CSS
.coral {
color: #FF7F50;
/* or */ color: rgb(255 127 80);
/* or */ color: hsl(16 100% 66%);
/* or */ color: oklch(73.5% 0.168 40.2);
/* CSS keyword */ color: coral;
}