Color code and palette
Coral Color
Coral is a warm pink-orange with the CSS value #FF7F50. It feels lively and approachable, giving calls to action and illustrations energy without the severity of pure red.
Coral #FF7F50
Color formats
The same base color in common web formats.
HEX
#FF7F50 RGB
rgb(255, 127, 80) HSL
hsl(16, 100%, 66%) OKLCH
oklch(74.0% 0.168 40.0) Coral is a warm pink-orange with the CSS value #FF7F50. It feels lively and approachable, giving calls to action and illustrations energy without the severity of pure red.
Shades
| Color | Name | Hex | |
|---|---|---|---|
| Coral 50 | #FFECE5 | ||
| Coral 100 | #FFC7B3 | ||
| Coral 200 | #FFA280 | ||
| Coral 300 | #FF7C4D | ||
| Coral 400 | #FF571A | ||
| Coral 500 | #E63D00 | ||
| Coral 600 | #B33000 | ||
| Coral 700 | #802200 | ||
| Coral 800 | #4D1400 | ||
| Coral 900 | #1A0700 |
Triadic color harmony
Three evenly spaced hues create a colorful but balanced starting palette.
Text contrast
These ratios use the WCAG relative luminance formula.
White textNaN:1
Black textNaN:1
Ways to use coral
01
Friendly calls to action
02
Travel and lifestyle illustration
03
Accents paired with teal