#2A855F#2A855F
#2A855F is a mid, moderate teal. Relative luminance 0.181; OKLCH L 55.3% C 0.104 H 161.7°. Best body text is #000000 at 4.62:1 contrast (WCAG AA passes).
Color values
| HEX | #2A855F |
|---|---|
| RGB | rgb(42, 133, 95) |
| HSL | hsl(155, 52%, 34%) |
| HSV | hsv(155, 68%, 52%) |
| CMYK | cmyk(68.4%, 0%, 28.6%, 47.8%) |
| CIE-LAB | lab(49.61, -36.16, 12.86) |
| CIE-LCH | lch(49.61, 38.38, 160.42°) |
| OKLab | oklab(55.3% -0.099 0.0328) |
| OKLCH | oklch(55.3% 0.104 161.7) |
| XYZ | xyz(11.4068, 18.0923, 13.7153) |
| Luminance | 0.1809 (WCAG relative) |
| Temperature | neutral |
| Family | teal |
Closest named colors
Dark Sea Green
#11875D
ΔE00 1.73
Sea Green
#2E8B57
ΔE00 4.05
Viridian
#1E9167
ΔE00 4.28
Jungle Green
#048243
ΔE00 6.46
Ocean Green
#3D9973
ΔE00 7.28
Dark Sage
#598556
ΔE00 7.66
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#2A855F #852A50
analogous
#2A8532 #2A855F #2A7E85
triadic
#2A855F #5F2A85 #855F2A
tetradic
#2A855F #322A85 #852A50 #7E852A
square
#2A855F #322A85 #852A50 #7E852A
split-complementary
#2A855F #852A7E #85322A
monochromatic
#0D281D #1B563E #2A855F #39B480 #5DCC9E
Accessibility & contrast
On white
4.55
#2A855F on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
4.62
#2A855F on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #2A855F
4.62:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##2A855F | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##2A855F | 1.00 | 4.55 | 4.62 | 4.62 |
| #FFFFFF | 4.55 | 1.00 | 21.00 | 21.00 |
| #000000 | 4.62 | 21.00 | 1.00 | 1.00 |
| ##000000 | 4.62 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#837B5D
Deuteranopia (green-blind)
#777261
Tritanopia (blue-blind)
#00857B
Achromatopsia (no color)
#767676
Design tokens & code
CSS
--color: #2a855f; /* rgb */ color: rgb(42, 133, 95); /* oklch */ color: oklch(55.3% 0.104 161.7);
Tailwind
colors: {
custom: {
50: '#6fa98c',
500: '#2a855f',
950: '#000000',
},
}SCSS
$custom: #2a855f; $custom-light: #6fa98c; $custom-dark: #000000;
JSON
{
"hex": "#2a855f",
"rgb": {
"r": 42,
"g": 133,
"b": 95
},
"hsl": {
"h": 154.945,
"s": 52,
"l": 34.314
},
"oklch": {
"l": 0.55295,
"c": 0.10431,
"h": 161.7
},
"luminance": 0.18094
}Semantic roles & 50–950 ramp
primary
#2A855F
secondary
#B2597E
accent
#4C88DB
background
#F7FAF8
surface
#EDF4F0
border
#C8CECB
text
#08100C
muted
#7B7F7D