命名颜色 · #CCBEB6
Blanched Driftwood
Blanched Driftwood 即 #CCBEB6：rgb(204 190 182)、hsl(22 18% 76%)、oklch(0.811 0.019 51.9)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Blanched Driftwood color name →
#CCBEB6
oklch(0.811 0.019 51.9)
颜色转换
- HEX
- #ccbeb6
- RGB
- rgb(204 190 182)
- HSL
- hsl(22 18% 76%)
- HWB
- hwb(22 71% 20%)
- OKLCH
- oklch(0.811 0.019 51.9)
- OKLab
- oklab(0.811 0.012 0.015)
- CIE Lab
- lab(77.98 4.09 5.92)
- LCH
- lch(77.98 7.2 55.3)
- CMYK
- cmyk(0% 7% 11% 20%)
浅色调 · 深色调 · 灰色调
浅色调
- D1C4BD
- D6CBC4
- DBD1CB
- E0D8D3
- E5DEDA
- EAE5E1
- F0EBE9
- F5F2F0
- FAF8F8
深色调
- B1A59E
- 978C86
- 7E756F
- 655E59
- 4E4844
- 373330
- 221F1D
- 0F0D0C
- 020202
灰色调
- C4B8B0
- BCB1AB
- B5ABA5
- ADA5A0
- A59E9B
- 9E9895
- 969290
- 8F8C8B
- 878685
配色和谐
互补色 +180°
- CCBEB6
Blanched Driftwood
- B5C4CC
≈ Lighthouse Shadows
类似色 -30° +30°
- CCBEB6
Blanched Driftwood
- CEBDBB
≈ Moth Pink
- C7C0B3
≈ Ashen
三角配色 +120° +240°
- CCBEB6
Blanched Driftwood
- B5C5C0
≈ Blustery Wind
- C1BFCD
≈ Gentleman’s Suit
分裂互补色 +150° +210°
- CCBEB6
Blanched Driftwood
- B3C5C6
≈ Blue Agave
- BAC2CE
≈ Misty Morning Dew
四角配色 +90° +180° +270°
- CCBEB6
Blanched Driftwood
- BAC5B9
≈ Antique Patina
- B5C4CC
≈ Lighthouse Shadows
- C7BDC9
≈ Stately Frills
对比度与无障碍
Ag
Fail白底
WCAG 1.80:1 · APCA Lc 34
Ag
AAA黑底
WCAG 11.60:1 · APCA Lc 69
最佳文字颜色: #000000
WCAG 11.60:1 (AAA) · APCA Lc 69
Contrast pairs
代码片段
CSS
:root {
--blanched-driftwood: #ccbeb6;
--blanched-driftwood-rgb: 204 190 182;
--blanched-driftwood-oklch: oklch(0.811 0.019 51.9);
}
.element {
color: var(--blanched-driftwood);
background-color: hsl(22 18% 76%);
border-color: oklch(0.811 0.019 51.9);
}Tailwind CSS v4
@theme {
--color-blanched-driftwood: #ccbeb6;
--color-blanched-driftwood-50: #faf4f0;
--color-blanched-driftwood-100: #ede6e2;
--color-blanched-driftwood-200: #dbd2cd;
--color-blanched-driftwood-300: #c0b5ae;
--color-blanched-driftwood-400: #a89b94;
--color-blanched-driftwood-500: #91837b;
--color-blanched-driftwood-600: #7b6f68;
--color-blanched-driftwood-700: #625953;
--color-blanched-driftwood-800: #48413c;
--color-blanched-driftwood-900: #322c2a;
--color-blanched-driftwood-950: #1e1a17;
}SCSS
$blanched-driftwood: #ccbeb6;
$blanched-driftwood-rgb: 204, 190, 182;
$blanched-driftwood-light: mix(#fff, $blanched-driftwood, 20%);
$blanched-driftwood-dark: mix(#000, $blanched-driftwood, 20%);
.element {
color: $blanched-driftwood;
box-shadow: 0 0 0 2px rgba($blanched-driftwood, 0.35);
}