#63AA49#63AA49
#63AA49 is a light, vivid green. Relative luminance 0.319; OKLCH L 66.9% C 0.150 H 138.1°. Best body text is #000000 at 7.38:1 contrast (WCAG AA passes).
Color values
| HEX | #63AA49 |
|---|---|
| RGB | rgb(99, 170, 73) |
| HSL | hsl(104, 40%, 48%) |
| HSV | hsv(104, 57%, 67%) |
| CMYK | cmyk(41.8%, 0%, 57.1%, 33.3%) |
| CIE-LAB | lab(63.25, -40.64, 42.47) |
| CIE-LCH | lch(63.25, 58.78, 133.74°) |
| OKLab | oklab(66.94% -0.1118 0.1003) |
| OKLCH | oklch(66.94% 0.15 138.1) |
| XYZ | xyz(20.7222, 31.8820, 11.3640) |
| Luminance | 0.3188 (WCAG relative) |
| Temperature | warm |
| Family | green |
Closest named colors
Fern (survey)
#63A950
ΔE00 1.27
Mid Green
#50A747
ΔE00 2.55
Asparagus
#77AB56
ΔE00 3.14
Off Green
#6BA353
ΔE00 3.19
Dark Pastel Green
#56AE57
ΔE00 3.30
Grass
#5CAC2D
ΔE00 3.61
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#63AA49 #9049AA
analogous
#93AA49 #63AA49 #49AA60
triadic
#63AA49 #4963AA #AA4963
tetradic
#63AA49 #4993AA #9049AA #AA6049
square
#63AA49 #4993AA #9049AA #AA6049
split-complementary
#63AA49 #6049AA #AA4993
monochromatic
#315424 #4A7F37 #63AA49 #85C16F #A9D49A
Accessibility & contrast
On white
2.85
#63AA49 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
7.38
#63AA49 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #63AA49
7.38:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##63AA49 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##63AA49 | 1.00 | 2.85 | 7.38 | 7.38 |
| #FFFFFF | 2.85 | 1.00 | 21.00 | 21.00 |
| #000000 | 7.38 | 21.00 | 1.00 | 1.00 |
| ##000000 | 7.38 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#AF9D3F
Deuteranopia (green-blind)
#A59750
Tritanopia (blue-blind)
#5FA595
Achromatopsia (no color)
#999999
Design tokens & code
CSS
--color: #63aa49; /* rgb */ color: rgb(99, 170, 73); /* oklch */ color: oklch(66.9% 0.150 138.1);
Tailwind
colors: {
custom: {
50: '#94c47f',
500: '#63aa49',
950: '#000000',
},
}SCSS
$custom: #63aa49; $custom-light: #94c47f; $custom-dark: #000000;
JSON
{
"hex": "#63aa49",
"rgb": {
"r": 99,
"g": 170,
"b": 73
},
"hsl": {
"h": 103.918,
"s": 39.918,
"l": 47.647
},
"oklch": {
"l": 0.66936,
"c": 0.1502,
"h": 138.1
},
"luminance": 0.31883
}Semantic roles & 50–950 ramp
primary
#63AA49
secondary
#B38FC0
accent
#58D0B0
background
#F9FCF7
surface
#F2F8EE
border
#CCD1C9
text
#0E120A
muted
#7E817C