orangewarmCSS named color

Coral #FF7F50

A bright pink-orange named after coral reefs; tropical energy.

Use cases: Summer palettes · Travel brands

Open in generator →Colors that go with Coral →

Families: Oranges · Coral Colors · Copper Colors

Color values

FormatValue
HEX#FF7F50
RGBrgb(255, 127, 80)
HSLhsl(16, 100%, 66%)
HSVhsv(16, 69%, 100%)
OKLCHoklch(73.51% 0.168 40.2)
OKLaboklab(73.51% 0.1282 0.1085)
CMYKcmyk(0%, 50.2%, 68.6%, 0%)
XYZxyz(50.282, 37.024, 12.0863)
CIE-LABlab(67.3, 45.4, 47.5)
CIE-LCHlch(67.3, 65.7, 46.3°)
Luminance0.370 (WCAG relative)
/* Coral */ --coral: #ff7f50; color: #ff7f50; background-color: #ff7f50;

Source: W3C CSS named color. CSS keyword: coral.

Collections: Vibrant Colors · Neon Colors · Tropical Colors · Sunset Colors

Shade scale

Perceptual 50–950 scale, interpolated in CIE-LAB. Step 500 is the base color. Edit in the shade generator →

50
100
200
300
400
500
600
700
800
900
950

OKLCH ramp (perceptually uniform, modern CSS)

50
100
200
300
400
500
600
700
800
900
950

Shades (toward black)

#e37248 #c76541 #ac5839 #924c32 #79402b #603423 #49281c #321d16 #1e120d #000000

Tints (toward white)

#ff8c61 #ff9972 #ffa683 #ffb394 #ffc0a5 #ffccb7 #ffd9c8 #ffe6da #fff2ed #ffffff

Tones (toward gray)

#f88459 #f08861 #e88c6a #e09072 #d8947a #cf9783 #c59b8b #bb9e93 #b0a19b #a4a4a4

Color harmonies

Complementary

Edit in generator →
#FF7F50
#50D0FF
#ff7f50 #50d0ff

Analogous

Edit in generator →
#FF5078
#FF7F50
#FFD650
#ff5078 #ff7f50 #ffd650

Triadic

Edit in generator →
#FF7F50
#50FF7F
#7F50FF
#ff7f50 #50ff7f #7f50ff

Tetradic

Edit in generator →
#FF7F50
#78FF50
#50D0FF
#D650FF
#ff7f50 #78ff50 #50d0ff #d650ff

Square

Edit in generator →
#FF7F50
#78FF50
#50D0FF
#D650FF
#ff7f50 #78ff50 #50d0ff #d650ff

Split Complementary

Edit in generator →
#FF7F50
#50FFD6
#5078FF
#ff7f50 #50ffd6 #5078ff

Monochromatic

Edit in generator →
#D53900
#FF5213
#FF7F50
#FFAC8D
#FFD9CA
#d53900 #ff5213 #ff7f50 #ffac8d #ffd9ca

Accessibility & contrast

2.50
#FF7F50 on #FFFFFF
AA text ✗AA large ✗AAA text ✗UI 3:1 ✗
8.40
#FF7F50 on #000000
AA text ✓AA large ✓AAA text ✓UI 3:1 ✓

Best text on Coral

8.40
#000000 text

WCAG 2.1: AA needs ≥4.5:1 for normal text, ≥3:1 for large text and UI components; AAA needs ≥7:1 / ≥4.5:1. Open the contrast checker →

Color blindness preview

Simulation using the Machado et al. (2009) physiological model, severity 1.0. This is an approximation of perception — not a medical assessment.

Normal vision
Protanopia (red-blind)
#A2924B
Deuteranopia (green-blind)
#C1AF4D
Tritanopia (blue-blind)
#FF6574

Closest named colors

Nearest matches by CIEDE2000 perceptual distance (ΔE₀₀) across the full color database.

ColorNameΔE₀₀
Orangish #FC824A2.53
Melon #FF78553.42
Orange Pink #FF6F525.58
Dark Peach #DE7E5D6.25
Orangeish #FD8D496.49
Tomato #FF63477.10

Combinations with Coral

Palettes with Coral

Colors that go with Coral

Top matches by hue harmony, contrast and saturation compatibility. See all 10 ranked combinations →

Rust #B7410E
2.2:1
Same hue family as coral (Δh 2°) — guaranteed harmony
Burgundy #800020
4.3:1
Analogous hue (Δh ≈31°) — neighbors on the color wheel
Dark Indigo #1F0954
6.9:1
Triadic harmony (Δh ≈119°) — balanced three-way contrast
Blue Blue #2242C7
3.1:1
Split-complementary angle (Δh ≈148°) — strong but softer than direct complement
Denim #1560BD
2.4:1
Complementary hue (Δh ≈163°) — maximum hue contrast

Values computed from the sRGB color model. CMYK is the naive sRGB conversion without an ICC profile. RGB percentages may differ between color-managed applications.

Coral Color — #FF7F50 — Tintiva