#F07E87#F07E87
#F07E87 is a light, vivid red. Relative luminance 0.352; OKLCH L 72.3% C 0.140 H 16.2°. Best body text is #000000 at 8.04:1 contrast (WCAG AA passes).
Color values
| HEX | #F07E87 |
|---|---|
| RGB | rgb(240, 126, 135) |
| HSL | hsl(355, 79%, 72%) |
| HSV | hsv(355, 48%, 94%) |
| CMYK | cmyk(0%, 47.5%, 43.8%, 5.9%) |
| CIE-LAB | lab(65.90, 44.50, 15.26) |
| CIE-LCH | lch(65.90, 47.05, 18.93°) |
| OKLab | oklab(72.32% 0.1344 0.0391) |
| OKLCH | oklch(72.32% 0.14 16.2) |
| XYZ | xyz(47.7721, 35.2010, 27.1956) |
| Luminance | 0.3520 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Blush Pink
#FE828C
ΔE00 2.52
Lightcoral
#F08080
ΔE00 2.80
Carnation
#FD798F
ΔE00 3.52
Salmon Pink
#FE7B7C
ΔE00 4.12
Rose Pink
#F7879A
ΔE00 4.28
Watermelon
#FC6C85
ΔE00 4.45
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#F07E87 #7EF0E7
analogous
#F07EC0 #F07E87 #F0AE7E
triadic
#F07E87 #87F07E #7E87F0
tetradic
#F07E87 #C0F07E #7EF0E7 #AE7EF0
square
#F07E87 #C0F07E #7EF0E7 #AE7EF0
split-complementary
#F07E87 #7EF0AE #7EC0F0
monochromatic
#DA1929 #EA4754 #F07E87 #F6B5BA #FCE4E6
Accessibility & contrast
On white
2.61
#F07E87 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.04
#F07E87 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #F07E87
8.04:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##F07E87 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##F07E87 | 1.00 | 2.61 | 8.04 | 8.04 |
| #FFFFFF | 2.61 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.04 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.04 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#959287
Deuteranopia (green-blind)
#B2A985
Tritanopia (blue-blind)
#FF7082
Achromatopsia (no color)
#A0A0A0
Design tokens & code
CSS
--color: #f07e87; /* rgb */ color: rgb(240, 126, 135); /* oklch */ color: oklch(72.3% 0.140 16.2);
Tailwind
colors: {
custom: {
50: '#f9a6a9',
500: '#f07e87',
950: '#000000',
},
}SCSS
$custom: #f07e87; $custom-light: #f9a6a9; $custom-dark: #000000;
JSON
{
"hex": "#f07e87",
"rgb": {
"r": 240,
"g": 126,
"b": 135
},
"hsl": {
"h": 355.263,
"s": 79.167,
"l": 71.765
},
"oklch": {
"l": 0.72321,
"c": 0.13994,
"h": 16.2
},
"luminance": 0.35196
}Semantic roles & 50–950 ramp
primary
#F07E87
secondary
#D6F3F1
accent
#DBCB0A
background
#FFFAFA
surface
#FFF4F4
border
#D7CECE
text
#180F10
muted
#867F7F