#FAF596#FAF596
#FAF596 is a very light, moderate yellow. Relative luminance 0.878; OKLCH L 95.4% C 0.117 H 105.8°. Best body text is #000000 at 18.57:1 contrast (WCAG AA passes).
Color values
| HEX | #FAF596 |
|---|---|
| RGB | rgb(250, 245, 150) |
| HSL | hsl(57, 91%, 78%) |
| HSV | hsv(57, 40%, 98%) |
| CMYK | cmyk(0%, 2%, 40%, 2%) |
| CIE-LAB | lab(95.09, -11.56, 46.28) |
| CIE-LCH | lch(95.09, 47.70, 104.02°) |
| OKLab | oklab(95.36% -0.0318 0.1125) |
| OKLCH | oklch(95.36% 0.117 105.8) |
| XYZ | xyz(77.5831, 87.8327, 41.7147) |
| Luminance | 0.8783 (WCAG relative) |
| Temperature | warm |
| Family | yellow |
Closest named colors
Buff
#FEF69E
ΔE00 1.38
Dark Cream
#FFF39A
ΔE00 2.05
Manilla
#FFFA86
ΔE00 3.02
Khaki (CSS)
#F0E68C
ΔE00 3.30
Parchment
#FEFCAF
ΔE00 3.52
Yellowish Tan
#FCFC81
ΔE00 3.95
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#FAF596 #969BFA
analogous
#FAC396 #FAF596 #CDFA96
triadic
#FAF596 #96FAF5 #F596FA
tetradic
#FAF596 #96FAC3 #969BFA #FA96CD
square
#FAF596 #96FAC3 #969BFA #FA96CD
split-complementary
#FAF596 #96CDFA #C396FA
monochromatic
#F4EA21 #F7EF5C #FAF596 #FDFBD0 #FEFCE2
Accessibility & contrast
On white
1.13
#FAF596 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
18.57
#FAF596 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #FAF596
18.57:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##FAF596 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##FAF596 | 1.00 | 1.13 | 18.57 | 18.57 |
| #FFFFFF | 1.13 | 1.00 | 21.00 | 21.00 |
| #000000 | 18.57 | 21.00 | 1.00 | 1.00 |
| ##000000 | 18.57 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#FFEE8F
Deuteranopia (green-blind)
#FFF39A
Tritanopia (blue-blind)
#FFEADE
Achromatopsia (no color)
#F1F1F1
Design tokens & code
CSS
--color: #faf596; /* rgb */ color: rgb(250, 245, 150); /* oklch */ color: oklch(95.4% 0.117 105.8);
Tailwind
colors: {
custom: {
50: '#fdf8b6',
500: '#faf596',
950: '#000000',
},
}SCSS
$custom: #faf596; $custom-light: #fdf8b6; $custom-dark: #000000;
JSON
{
"hex": "#faf596",
"rgb": {
"r": 250,
"g": 245,
"b": 150
},
"hsl": {
"h": 57,
"s": 90.909,
"l": 78.431
},
"oklch": {
"l": 0.95364,
"c": 0.11691,
"h": 105.8
},
"luminance": 0.87831
}Semantic roles & 50–950 ramp
primary
#FAF596
secondary
#5A60DA
accent
#0BE600
background
#FFFFFD
surface
#FFFEF8
border
#D7D6D1
text
#181711
muted
#868581