Coral #FF7F50
Coral, with hex code #FF7F50 in CSS, is a bright, warm orange with a pink edge. Medium-light and saturated, it stays lively without tipping into neon. Its name comes from the marine animals that build reefs and the red coral used in jewelry, and it is closely tied to tropical beaches, summer dresses and sunsets.
#FF7F50 is the CSS keyword coral. CSS also has lightcoral #F08080, which is pinker and softer.
| HEX | #FF7F50 | |
|---|---|---|
| RGB | rgb(255, 127, 80) | |
| HSL | hsl(16, 100%, 66%) | |
| HSV | hsv(16, 69%, 100%) | |
| CMYK | cmyk(0%, 50%, 69%, 0%) |
Text on Coral
Black text reads better on Coral. Ratios use the WCAG 2 formula: 4.5:1 passes AA for body text, 3:1 passes for large text.
The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog.
Colors that go with Coral
Coral tints and shades
Tints mix Coral with white, shades mix it with black, in 15% steps. Copy any code, or open the tint and shade generator for a full scale.
Tints
Shades
Coral color schemes
Color-wheel harmonies built by rotating the hue of #FF7F50 and keeping its saturation and lightness.
Complementary
Analogous
Triadic
Split complementary
Tetradic
Coral color meaning
Coral feels warm, sociable and optimistic. It is less aggressive than red and softer than pure orange, which makes it a popular choice when brands want warmth with a friendly face.
Pantone named Living Coral its Color of the Year for 2019, and the shade spread across fashion, cosmetics and tech marketing that year. The name also links the color to ocean reefs, so for some people coral carries a quiet reminder of marine life and its conservation.
Red coral from the Mediterranean has been carved into jewelry and beads for a very long time, and it is still used in traditional jewelry in several regions. Today, though, the color name is tied mostly to beach and summer imagery, from swimwear to cocktail menus.
How to use Coral in design
Coral is a good primary or accent color for travel, food, health, social apps and lifestyle brands. Dark text such as charcoal or navy reads clearly on it; white text only works for large, bold headings. As a button color it feels inviting, and on social posts it looks good against deep teal or navy backgrounds.
In fashion it is a summer staple in dresses and swimwear. In interiors, coral looks good on cushions, ceramics and accent walls next to turquoise, white and sandy neutrals.
Palettes with Coral tones
Curated palettes with a color close to #FF7F50.
Colors similar to Coral
Work with Coral
Coral FAQ
Is coral pink or orange?
Coral is an orange-pink. The CSS value #FF7F50 has a clear orange base with enough red to give it a pink tint, so many people describe it as pinkish orange. Lighter corals look closer to peach or salmon, and deeper corals move toward red.
What colors go with coral?
Blues and blue-greens are coral's best partners because they sit opposite it on the color wheel. Turquoise and teal feel tropical, and navy feels nautical. For softer palettes, combine coral with cream, sand or blush. Charcoal works well for text and as a grounding dark neutral.