Named color · #4D8681
Jericho Jade
Jericho Jade is #4D8681: rgb(77 134 129), hsl(175 27% 41%), oklch(0.579 0.061 188.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Teal mean? → · Jericho Jade color name →
#4D8681
oklch(0.579 0.061 188.4)
Color conversions
- HEX
- #4d8681
- RGB
- rgb(77 134 129)
- HSL
- hsl(175 27% 41%)
- HWB
- hwb(175 30% 47%)
- OKLCH
- oklch(0.579 0.061 188.4)
- OKLab
- oklab(0.579 -0.06 -0.009)
- CIE Lab
- lab(51.92 -20.55 -3.51)
- LCH
- lch(51.92 20.85 189.7)
- CMYK
- cmyk(43% 0% 4% 47%)
Tints · Shades · Tones
Tints
- 5F928D
- 719D99
- 82A9A5
- 94B5B2
- A5C1BE
- B7CDCB
- C9DAD8
- DBE6E5
- EDF2F2
Shades
- 42746F
- 37625E
- 2C514E
- 22403E
- 18302E
- 0F211F
- 071312
- 020606
- 000101
Tones
- 538681
- 598581
- 5F8481
- 648481
- 698381
- 6E8380
- 738280
- 778180
- 7C8180
Color harmonies
Complementary +180°
- 4D8681
Jericho Jade
- 9A6B73
≈ Montrose Rose
Analogous -30° +30°
- 4D8681
Jericho Jade
- 5B856D
≈ Clouded Pine
- 4E8392
≈ Cape Lee
Triadic +120° +240°
- 4D8681
Jericho Jade
- 847196
≈ Baroness Mauve
- 927453
≈ Sagebrush
Split-complementary +150° +210°
- 4D8681
Jericho Jade
- 936C86
≈ Sophisticated Lilac
- 9A6E60
≈ Reddened Earth
Tetradic +90° +180° +270°
- 4D8681
Jericho Jade
- 72779E
≈ Kimono Violet
- 9A6B73
≈ Montrose Rose
- 837B50
≈ Fern Grove
Contrast & accessibility
Ag
FailOn white
WCAG 4.16:1 · APCA Lc 69
Ag
AAOn black
WCAG 5.04:1 · APCA Lc 33
Best text color: #000000
WCAG 5.04:1 (AA) · APCA Lc 33
Contrast pairs
Code snippets
CSS
:root {
--jericho-jade: #4d8681;
--jericho-jade-rgb: 77 134 129;
--jericho-jade-oklch: oklch(0.579 0.061 188.4);
}
.element {
color: var(--jericho-jade);
background-color: hsl(175 27% 41%);
border-color: oklch(0.579 0.061 188.4);
}Tailwind CSS v4
@theme {
--color-jericho-jade: #4d8681;
--color-jericho-jade-50: #e2fbf9;
--color-jericho-jade-100: #d2efec;
--color-jericho-jade-200: #b8ddda;
--color-jericho-jade-300: #94c2be;
--color-jericho-jade-400: #74aaa5;
--color-jericho-jade-500: #53938e;
--color-jericho-jade-600: #477d78;
--color-jericho-jade-700: #396460;
--color-jericho-jade-800: #284946;
--color-jericho-jade-900: #1b3330;
--color-jericho-jade-950: #0b1f1c;
}SCSS
$jericho-jade: #4d8681;
$jericho-jade-rgb: 77, 134, 129;
$jericho-jade-light: mix(#fff, $jericho-jade, 20%);
$jericho-jade-dark: mix(#000, $jericho-jade, 20%);
.element {
color: $jericho-jade;
box-shadow: 0 0 0 2px rgba($jericho-jade, 0.35);
}