Coral color guide
Pink-leaning orange that reads friendly and modern without the childishness of brighter oranges.
- Best for
- Approachable CTAs and consumer product accents.
Accessibility
Ratios follow WCAG 2.1. AA needs 4.5:1 for body text, AAA needs 7:1; large text passes AA at 3:1.
Colors that go with coral
Combinations that hold up in a real layout rather than only on the colour wheel.
Coral color harmonies
Coral shades and tints
The same hue and saturation across ten lightness steps — the basis of a usable colour ramp in a design system.
Coral FAQ
What is the hex code for coral?
Coral is #FF7F50. In other formats that is rgb(255, 127, 80), hsl(16, 100%, 66%), and approximately cmyk(0%, 50%, 69%, 0%) for print.
What colors go with coral?
Teal, Navy Blue, Cream all pair well with coral. Approachable CTAs and consumer product accents.
Is coral accessible for text?
Not on white: coral reaches only 2.5:1 there, below the 4.5:1 WCAG AA threshold. Use it as a background with black text on top, or reserve it for large display type.
Should text on coral be black or white?
Use black text. It gives the higher contrast ratio of the two against #FF7F50.