最接近的命名颜色 · #CFDCBF
#CFDCBF
最接近的命名颜色: Zen Garden
#CFDCBF（rgb(207 220 191)、hsl(87 29% 81%)、oklch(0.877 0.041 127)）最接近命名颜色 Zen Garden。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#CFDCBF
oklch(0.877 0.041 127)
颜色转换
- HEX
- #cfdcbf
- RGB
- rgb(207 220 191)
- HSL
- hsl(87 29% 81%)
- HWB
- hwb(87 75% 14%)
- OKLCH
- oklch(0.877 0.041 127)
- OKLab
- oklab(0.877 -0.025 0.033)
- CIE Lab
- lab(86.18 -8.35 12.74)
- LCH
- lch(86.18 15.24 123.2)
- CMYK
- cmyk(6% 0% 13% 14%)
浅色调 · 深色调 · 灰色调
浅色调
- D4DFC5
- D8E3CC
- DDE6D2
- E2EAD8
- E7EDDF
- ECF1E5
- F0F4EC
- F5F8F2
- FAFBF9
深色调
- B4BFA6
- 99A38D
- 7F8875
- 676E5E
- 4F5448
- 383C33
- 23261F
- 10110D
- 020202
灰色调
- C7D2B9
- BFC9B2
- B7C0AC
- AFB6A5
- A7AD9F
- 9FA499
- 979B93
- 8F928C
- 888986
配色和谐
互补色 +180°
- CFDCBF
Zen Garden
- DDD0EC
≈ Shimmering Sky
类似色 -30° +30°
- CFDCBF
Zen Garden
- DED7B9
≈ Handmade Linen
- C1DFCC
≈ Luna Green
三角配色 +120° +240°
- CFDCBF
Zen Garden
- C1DAF1
≈ Light Powder Blue
- F0CCD2
≈ Milkshake Pink
分裂互补色 +150° +210°
- CFDCBF
Zen Garden
- CFD5F2
≈ Flax Bloom
- E9CDE1
≈ Sweety Pie
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.43:1 · APCA Lc 21
Ag
AAA黑底
WCAG 14.64:1 · APCA Lc 83
最佳文字颜色: #000000
WCAG 14.64:1 (AAA) · APCA Lc 83
Contrast pairs
代码片段
CSS
:root {
--zen-garden: #cfdcbf;
--zen-garden-rgb: 207 220 191;
--zen-garden-oklch: oklch(0.877 0.041 127);
}
.element {
color: var(--zen-garden);
background-color: hsl(87 29% 81%);
border-color: oklch(0.877 0.041 127);
}Tailwind CSS v4
@theme {
--color-zen-garden: #cfdcbf;
--color-zen-garden-50: #f1f8eb;
--color-zen-garden-100: #e4ebdc;
--color-zen-garden-200: #cfd8c6;
--color-zen-garden-300: #b1bca6;
--color-zen-garden-400: #98a389;
--color-zen-garden-500: #7f8c6e;
--color-zen-garden-600: #6b765d;
--color-zen-garden-700: #565f4b;
--color-zen-garden-800: #3f4535;
--color-zen-garden-900: #2b3024;
--color-zen-garden-950: #191c13;
}SCSS
$zen-garden: #cfdcbf;
$zen-garden-rgb: 207, 220, 191;
$zen-garden-light: mix(#fff, $zen-garden, 20%);
$zen-garden-dark: mix(#000, $zen-garden, 20%);
.element {
color: $zen-garden;
box-shadow: 0 0 0 2px rgba($zen-garden, 0.35);
}