#C2C356#C2C356
#C2C356 is a light, vivid yellow. Relative luminance 0.512; OKLCH L 79.5% C 0.132 H 109.5°. Best body text is #000000 at 11.23:1 contrast (WCAG AA passes).
Color values
| HEX | #C2C356 |
|---|---|
| RGB | rgb(194, 195, 86) |
| HSL | hsl(61, 48%, 55%) |
| HSV | hsv(61, 56%, 76%) |
| CMYK | cmyk(0.5%, 0%, 55.9%, 23.5%) |
| CIE-LAB | lab(76.78, -14.77, 53.58) |
| CIE-LCH | lch(76.78, 55.58, 105.42°) |
| OKLab | oklab(79.47% -0.0441 0.1242) |
| OKLCH | oklch(79.47% 0.132 109.5) |
| XYZ | xyz(43.4441, 51.1725, 16.3911) |
| Luminance | 0.5117 (WCAG relative) |
| Temperature | warm |
| Family | yellow |
Closest named colors
Greenish Beige
#C9D179
ΔE00 5.22
Darkkhaki
#BDB76B
ΔE00 5.65
Puke Yellow
#C2BE0E
ΔE00 5.87
Bile
#B5C306
ΔE00 6.01
Baby Puke Green
#B6C406
ΔE00 6.03
Vomit Yellow
#C7C10C
ΔE00 6.18
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#C2C356 #5756C3
analogous
#C38D56 #C2C356 #8CC356
triadic
#C2C356 #56C2C3 #C356C2
tetradic
#C2C356 #56C38D #5756C3 #C3568C
square
#C2C356 #56C38D #5756C3 #C3568C
split-complementary
#C2C356 #568CC3 #8D56C3
monochromatic
#74752A #A1A23A #C2C356 #D2D383 #E3E3B0
Accessibility & contrast
On white
1.87
#C2C356 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
11.23
#C2C356 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #C2C356
11.23:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##C2C356 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##C2C356 | 1.00 | 1.87 | 11.23 | 11.23 |
| #FFFFFF | 1.87 | 1.00 | 21.00 | 21.00 |
| #000000 | 11.23 | 21.00 | 1.00 | 1.00 |
| ##000000 | 11.23 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#D1BC4B
Deuteranopia (green-blind)
#D2BF5C
Tritanopia (blue-blind)
#CEB8AB
Achromatopsia (no color)
#BDBDBD
Design tokens & code
CSS
--color: #c2c356; /* rgb */ color: rgb(194, 195, 86); /* oklch */ color: oklch(79.5% 0.132 109.5);
Tailwind
colors: {
custom: {
50: '#d7d589',
500: '#c2c356',
950: '#000000',
},
}SCSS
$custom: #c2c356; $custom-light: #d7d589; $custom-dark: #000000;
JSON
{
"hex": "#c2c356",
"rgb": {
"r": 194,
"g": 195,
"b": 86
},
"hsl": {
"h": 60.55,
"s": 47.598,
"l": 55.098
},
"oklch": {
"l": 0.79474,
"c": 0.13181,
"h": 109.5
},
"luminance": 0.51171
}Semantic roles & 50–950 ramp
primary
#C2C356
secondary
#403F7E
accent
#51D752
background
#FEFEFC
surface
#FCFBF4
border
#D5D4CE
text
#15140C
muted
#84837F