最接近的命名颜色 · #C0CCBA
#C0CCBA
最接近的命名颜色: Bok Choy
#C0CCBA（rgb(192 204 186)、hsl(100 15% 76%)、oklch(0.831 0.028 135)）最接近命名颜色 Bok Choy。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#C0CCBA
oklch(0.831 0.028 135)
颜色转换
- HEX
- #c0ccba
- RGB
- rgb(192 204 186)
- HSL
- hsl(100 15% 76%)
- HWB
- hwb(100 73% 20%)
- OKLCH
- oklch(0.831 0.028 135)
- OKLab
- oklab(0.831 -0.02 0.02)
- CIE Lab
- lab(80.73 -6.7 7.53)
- LCH
- lch(80.73 10.08 131.7)
- CMYK
- cmyk(6% 0% 9% 20%)
浅色调 · 深色调 · 灰色调
浅色调
- C6D1C1
- CCD6C8
- D3DBCE
- D9E0D5
- DFE5DC
- E5EAE3
- ECF0EA
- F2F5F1
- F9FAF8
深色调
- A7B1A1
- 8E9789
- 767E72
- 5F655C
- 494E46
- 343732
- 20221E
- 0E0F0D
- 020202
灰色调
- B9C4B4
- B3BCAE
- ACB5A8
- A6ADA2
- 9FA59D
- 999E97
- 939691
- 8C8F8B
- 868786
配色和谐
互补色 +180°
- C0CCBA
Bok Choy
- CFC3D4
≈ Orchid Hush
类似色 -30° +30°
- C0CCBA
Bok Choy
- CAC9B4
≈ Ocean Foam
- B8CEC3
≈ Quiet Drizzle
三角配色 +120° +240°
- C0CCBA
Bok Choy
- BCC9DA
≈ Light Pearl Soft Blue
- D9C1C2
≈ Mud Pink
分裂互补色 +150° +210°
- C0CCBA
Bok Choy
- C5C5DA
≈ Violet Sweet Pea
- D6C1CC
≈ Mint Blossom Rose
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.66:1 · APCA Lc 29
Ag
AAA黑底
WCAG 12.58:1 · APCA Lc 73
最佳文字颜色: #000000
WCAG 12.58:1 (AAA) · APCA Lc 73
Contrast pairs
代码片段
CSS
:root {
--bok-choy: #c0ccba;
--bok-choy-rgb: 192 204 186;
--bok-choy-oklch: oklch(0.831 0.028 135);
}
.element {
color: var(--bok-choy);
background-color: hsl(100 15% 76%);
border-color: oklch(0.831 0.028 135);
}Tailwind CSS v4
@theme {
--color-bok-choy: #c0ccba;
--color-bok-choy-50: #f1f7ef;
--color-bok-choy-100: #e4eae1;
--color-bok-choy-200: #cfd7cc;
--color-bok-choy-300: #b1bbad;
--color-bok-choy-400: #97a292;
--color-bok-choy-500: #7e8b78;
--color-bok-choy-600: #6b7566;
--color-bok-choy-700: #555e51;
--color-bok-choy-800: #3f453b;
--color-bok-choy-900: #2b2f28;
--color-bok-choy-950: #181c16;
}SCSS
$bok-choy: #c0ccba;
$bok-choy-rgb: 192, 204, 186;
$bok-choy-light: mix(#fff, $bok-choy, 20%);
$bok-choy-dark: mix(#000, $bok-choy, 20%);
.element {
color: $bok-choy;
box-shadow: 0 0 0 2px rgba($bok-choy, 0.35);
}