最接近的命名颜色 · #CFD2AC
#CFD2AC
最接近的命名颜色: Bitter Melon
#CFD2AC（rgb(207 210 172)、hsl(65 30% 75%)、oklch(0.852 0.051 111.1)）最接近命名颜色 Bitter Melon。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#CFD2AC
oklch(0.852 0.051 111.1)
颜色转换
- HEX
- #cfd2ac
- RGB
- rgb(207 210 172)
- HSL
- hsl(65 30% 75%)
- HWB
- hwb(65 67% 18%)
- OKLCH
- oklch(0.852 0.051 111.1)
- OKLab
- oklab(0.852 -0.018 0.048)
- CIE Lab
- lab(83.22 -5.79 18.57)
- LCH
- lch(83.22 19.45 107.3)
- CMYK
- cmyk(1% 0% 18% 18%)
浅色调 · 深色调 · 灰色调
浅色调
- D4D6B4
- D8DBBC
- DDDFC5
- E2E4CD
- E7E8D5
- EBEDDE
- F0F1E6
- F5F6EE
- FAFAF7
深色调
- B4B695
- 999B7F
- 7F8169
- 676854
- 4F5040
- 38392D
- 23241B
- 10100B
- 020201
灰色调
- C7CAA8
- BFC1A3
- B7B99F
- AFB09B
- A7A896
- 9FA092
- 97988D
- 8F9089
- 888884
配色和谐
互补色 +180°
- CFD2AC
Bitter Melon
- CEC9EE
≈ Soap
类似色 -30° +30°
- CFD2AC
Bitter Melon
- E0CCA9
≈ Hearth
- BDD7B8
≈ Lamina
三角配色 +120° +240°
- CFD2AC
Bitter Melon
- ADD5EA
≈ Ariel
- EAC1D2
≈ Misty Memories
分裂互补色 +150° +210°
- CFD2AC
Bitter Melon
- BCCFF0
≈ Frost Fairy
- DEC4E3
≈ Glittering Gemstone
四角配色 +90° +180° +270°
- CFD2AC
Bitter Melon
- A8D9DC
≈ Crystal
- CEC9EE
≈ Soap
- EEC2C0
≈ Cafe Pink
对比度与无障碍
Ag
Fail白底
WCAG 1.55:1 · APCA Lc 26
Ag
AAA黑底
WCAG 13.46:1 · APCA Lc 77
最佳文字颜色: #000000
WCAG 13.46:1 (AAA) · APCA Lc 77
Contrast pairs
代码片段
CSS
:root {
--bitter-melon: #cfd2ac;
--bitter-melon-rgb: 207 210 172;
--bitter-melon-oklch: oklch(0.852 0.051 111.1);
}
.element {
color: var(--bitter-melon);
background-color: hsl(65 30% 75%);
border-color: oklch(0.852 0.051 111.1);
}Tailwind CSS v4
@theme {
--color-bitter-melon: #cfd2ac;
--color-bitter-melon-50: #f5f7e7;
--color-bitter-melon-100: #e7ead7;
--color-bitter-melon-200: #d4d7be;
--color-bitter-melon-300: #b7bb9d;
--color-bitter-melon-400: #9fa27f;
--color-bitter-melon-500: #878a62;
--color-bitter-melon-600: #727554;
--color-bitter-melon-700: #5b5d43;
--color-bitter-melon-800: #43442f;
--color-bitter-melon-900: #2f2f20;
--color-bitter-melon-950: #1b1b10;
}SCSS
$bitter-melon: #cfd2ac;
$bitter-melon-rgb: 207, 210, 172;
$bitter-melon-light: mix(#fff, $bitter-melon, 20%);
$bitter-melon-dark: mix(#000, $bitter-melon, 20%);
.element {
color: $bitter-melon;
box-shadow: 0 0 0 2px rgba($bitter-melon, 0.35);
}