#F2D588#F2D588
#F2D588 is a very light, moderate orange. Relative luminance 0.682; OKLCH L 88.1% C 0.101 H 89.6°. Best body text is #000000 at 14.65:1 contrast (WCAG AA passes).
Color values
| HEX | #F2D588 |
|---|---|
| RGB | rgb(242, 213, 136) |
| HSL | hsl(44, 80%, 74%) |
| HSV | hsv(44, 44%, 95%) |
| CMYK | cmyk(0%, 12%, 43.8%, 5.1%) |
| CIE-LAB | lab(86.13, -0.02, 41.68) |
| CIE-LCH | lch(86.13, 41.68, 90.02°) |
| OKLab | oklab(88.05% 0.0007 0.1014) |
| OKLCH | oklch(88.05% 0.101 89.6) |
| XYZ | xyz(64.8580, 68.2460, 33.0442) |
| Luminance | 0.6824 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Wheat (survey)
#FBDD7E
ΔE00 3.37
Sand (survey)
#E2CA76
ΔE00 3.58
Sandy
#F1DA7A
ΔE00 3.89
Pale Peach
#FFE5AD
ΔE00 5.61
Pale Gold
#FDDE6C
ΔE00 5.78
Light Mustard
#F7D560
ΔE00 5.83
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#F2D588 #88A5F2
analogous
#F2A088 #F2D588 #DAF288
triadic
#F2D588 #88F2D5 #D588F2
tetradic
#F2D588 #88F2A0 #88A5F2 #F288DA
square
#F2D588 #88F2A0 #88A5F2 #F288DA
split-complementary
#F2D588 #88DAF2 #A088F2
monochromatic
#E6AE1A #ECC251 #F2D588 #F8E8BF #FCF5E3
Accessibility & contrast
On white
1.43
#F2D588 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
14.65
#F2D588 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #F2D588
14.65:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##F2D588 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##F2D588 | 1.00 | 1.43 | 14.65 | 14.65 |
| #FFFFFF | 1.43 | 1.00 | 21.00 | 21.00 |
| #000000 | 14.65 | 21.00 | 1.00 | 1.00 |
| ##000000 | 14.65 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#E5D382
Deuteranopia (green-blind)
#ECDB8B
Tritanopia (blue-blind)
#FFC9C2
Achromatopsia (no color)
#D7D7D7
Design tokens & code
CSS
--color: #f2d588; /* rgb */ color: rgb(242, 213, 136); /* oklch */ color: oklch(88.1% 0.101 89.6);
Tailwind
colors: {
custom: {
50: '#f8e1ac',
500: '#f2d588',
950: '#000000',
},
}SCSS
$custom: #f2d588; $custom-light: #f8e1ac; $custom-dark: #000000;
JSON
{
"hex": "#f2d588",
"rgb": {
"r": 242,
"g": 213,
"b": 136
},
"hsl": {
"h": 43.585,
"s": 80.303,
"l": 74.118
},
"oklch": {
"l": 0.88051,
"c": 0.10142,
"h": 89.6
},
"luminance": 0.68243
}Semantic roles & 50–950 ramp
primary
#F2D588
secondary
#5073CE
accent
#43DD09
background
#FFFEFD
surface
#FFFCF7
border
#D7D5D0
text
#171510
muted
#858481