#CCF660#CCF660
#CCF660 is a very light, vivid yellow-green. Relative luminance 0.796; OKLCH L 91.5% C 0.181 H 123.2°. Best body text is #000000 at 16.92:1 contrast (WCAG AA passes).
Color values
| HEX | #CCF660 |
|---|---|
| RGB | rgb(204, 246, 96) |
| HSL | hsl(77, 89%, 67%) |
| HSV | hsv(77, 61%, 96%) |
| CMYK | cmyk(17.1%, 0%, 61%, 3.5%) |
| CIE-LAB | lab(91.50, -34.53, 65.78) |
| CIE-LCH | lch(91.50, 74.29, 117.69°) |
| OKLab | oklab(91.49% -0.0991 0.1512) |
| OKLCH | oklch(91.49% 0.181 123.2) |
| XYZ | xyz(59.9694, 79.5931, 23.2677) |
| Luminance | 0.7959 (WCAG relative) |
| Temperature | warm |
| Family | yellow-green |
Closest named colors
Pear
#CBF85F
ΔE00 0.57
Yellow Green
#C8FD3D
ΔE00 3.40
Light Yellow Green
#CCFD7F
ΔE00 3.82
Yellowy Green
#BFF128
ΔE00 3.91
Pale Lime
#BEFD73
ΔE00 4.29
Light Lime Green
#B9FF66
ΔE00 4.41
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#CCF660 #8A60F6
analogous
#F6D560 #CCF660 #81F660
triadic
#CCF660 #60CCF6 #F660CC
tetradic
#CCF660 #60F6D5 #8A60F6 #F66081
square
#CCF660 #60F6D5 #8A60F6 #F66081
split-complementary
#CCF660 #6081F6 #D560F6
monochromatic
#99D00C #B9F326 #CCF660 #DFF99A #F1FDD4
Accessibility & contrast
On white
1.24
#CCF660 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
16.92
#CCF660 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #CCF660
16.92:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##CCF660 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##CCF660 | 1.00 | 1.24 | 16.92 | 16.92 |
| #FFFFFF | 1.24 | 1.00 | 21.00 | 21.00 |
| #000000 | 16.92 | 21.00 | 1.00 | 1.00 |
| ##000000 | 16.92 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#FFE84E
Deuteranopia (green-blind)
#FEE66B
Tritanopia (blue-blind)
#D5EBD6
Achromatopsia (no color)
#E7E7E7
Design tokens & code
CSS
--color: #ccf660; /* rgb */ color: rgb(204, 246, 96); /* oklch */ color: oklch(91.5% 0.181 123.2);
Tailwind
colors: {
custom: {
50: '#dff993',
500: '#ccf660',
950: '#000000',
},
}SCSS
$custom: #ccf660; $custom-light: #dff993; $custom-dark: #000000;
JSON
{
"hex": "#ccf660",
"rgb": {
"r": 204,
"g": 246,
"b": 96
},
"hsl": {
"h": 76.8,
"s": 89.286,
"l": 67.059
},
"oklch": {
"l": 0.9149,
"c": 0.18078,
"h": 123.2
},
"luminance": 0.79593
}Semantic roles & 50–950 ramp
primary
#CCF660
secondary
#5B2FCB
accent
#00E640
background
#FEFFFC
surface
#FCFFF4
border
#D5D7CE
text
#15170D
muted
#84857F