命名颜色 · #4D8681
Jericho Jade
Jericho Jade 即 #4D8681:rgb(77 134 129)、hsl(175 27% 41%)、oklch(0.579 0.061 188.4)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Teal mean? → · Jericho Jade color name →
#4D8681
oklch(0.579 0.061 188.4)
颜色转换
- 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%)
浅色调 · 深色调 · 灰色调
浅色调
- 5F928D
- 719D99
- 82A9A5
- 94B5B2
- A5C1BE
- B7CDCB
- C9DAD8
- DBE6E5
- EDF2F2
深色调
- 42746F
- 37625E
- 2C514E
- 22403E
- 18302E
- 0F211F
- 071312
- 020606
- 000101
灰色调
- 538681
- 598581
- 5F8481
- 648481
- 698381
- 6E8380
- 738280
- 778180
- 7C8180
配色和谐
互补色 +180°
- 4D8681
Jericho Jade
- 9A6B73
≈ Montrose Rose
类似色 -30° +30°
- 4D8681
Jericho Jade
- 5B856D
≈ Clouded Pine
- 4E8392
≈ Cape Lee
三角配色 +120° +240°
- 4D8681
Jericho Jade
- 847196
≈ Baroness Mauve
- 927453
≈ Sagebrush
分裂互补色 +150° +210°
- 4D8681
Jericho Jade
- 936C86
≈ Sophisticated Lilac
- 9A6E60
≈ Reddened Earth
四角配色 +90° +180° +270°
- 4D8681
Jericho Jade
- 72779E
≈ Kimono Violet
- 9A6B73
≈ Montrose Rose
- 837B50
≈ Fern Grove
对比度与无障碍
Ag
Fail白底
WCAG 4.16:1 · APCA Lc 69
Ag
AA黑底
WCAG 5.04:1 · APCA Lc 33
最佳文字颜色: #000000
WCAG 5.04:1 (AA) · APCA Lc 33
Contrast pairs
代码片段
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);
}