命名颜色 · #CCCCBA
Mix or Match
Mix or Match 即 #CCCCBA：rgb(204 204 186)、hsl(60 15% 76%)、oklch(0.84 0.024 106.9)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Mix or Match color name →
#CCCCBA
oklch(0.84 0.024 106.9)
颜色转换
- HEX
- #ccccba
- RGB
- rgb(204 204 186)
- HSL
- hsl(60 15% 76%)
- HWB
- hwb(60 73% 20%)
- OKLCH
- oklch(0.84 0.024 106.9)
- OKLab
- oklab(0.84 -0.007 0.023)
- CIE Lab
- lab(81.67 -2.34 9.01)
- LCH
- lch(81.67 9.31 104.6)
- CMYK
- cmyk(0% 0% 9% 20%)
浅色调 · 深色调 · 灰色调
浅色调
- D1D1C1
- D6D6C8
- DBDBCE
- E0E0D5
- E5E5DC
- EAEAE3
- EFF0EA
- F5F5F1
- FAFAF8
深色调
- B1B1A1
- 979789
- 7E7E72
- 65655C
- 4E4E46
- 373732
- 22221E
- 0F0F0D
- 020202
灰色调
- C4C4B4
- BCBCAE
- B5B5A8
- ADADA2
- A5A59D
- 9E9E97
- 969691
- 8F8F8B
- 878786
配色和谐
互补色 +180°
- CCCCBA
Mix or Match
- C9C9DA
≈ Daybreak Beckons
类似色 -30° +30°
- CCCCBA
Mix or Match
- D4C9B9
≈ September Fog
- C3CFBF
≈ Gentle Calm
三角配色 +120° +240°
- CCCCBA
Mix or Match
- BBCED7
≈ Light Vanilla Ice
- D7C5CE
≈ Rosy Lavender
分裂互补色 +150° +210°
- CCCCBA
Mix or Match
- C1CCDB
≈ Icy Brook
- D1C6D5
≈ Moon Goddess
四角配色 +90° +180° +270°
- CCCCBA
Mix or Match
- B9D0D0
≈ Malaysian Mist
- C9C9DA
≈ Daybreak Beckons
- DAC5C5
≈ Fairview Taupe
对比度与无障碍
Ag
Fail白底
WCAG 1.62:1 · APCA Lc 28
Ag
AAA黑底
WCAG 12.91:1 · APCA Lc 75
最佳文字颜色: #000000
WCAG 12.91:1 (AAA) · APCA Lc 75
Contrast pairs
代码片段
CSS
:root {
--mix-or-match: #ccccba;
--mix-or-match-rgb: 204 204 186;
--mix-or-match-oklch: oklch(0.84 0.024 106.9);
}
.element {
color: var(--mix-or-match);
background-color: hsl(60 15% 76%);
border-color: oklch(0.84 0.024 106.9);
}Tailwind CSS v4
@theme {
--color-mix-or-match: #ccccba;
--color-mix-or-match-50: #f5f6ee;
--color-mix-or-match-100: #e8e9df;
--color-mix-or-match-200: #d5d5c9;
--color-mix-or-match-300: #b8b9aa;
--color-mix-or-match-400: #a0a08f;
--color-mix-or-match-500: #888875;
--color-mix-or-match-600: #737363;
--color-mix-or-match-700: #5c5c4f;
--color-mix-or-match-800: #434339;
--color-mix-or-match-900: #2f2e27;
--color-mix-or-match-950: #1b1b15;
}SCSS
$mix-or-match: #ccccba;
$mix-or-match-rgb: 204, 204, 186;
$mix-or-match-light: mix(#fff, $mix-or-match, 20%);
$mix-or-match-dark: mix(#000, $mix-or-match, 20%);
.element {
color: $mix-or-match;
box-shadow: 0 0 0 2px rgba($mix-or-match, 0.35);
}