命名颜色 · #C3BAB0
Luxe Grey
Luxe Grey 即 #C3BAB0：rgb(195 186 176)、hsl(32 14% 73%)、oklch(0.793 0.017 70.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Luxe Grey color name →
#C3BAB0
oklch(0.793 0.017 70.5)
颜色转换
- HEX
- #c3bab0
- RGB
- rgb(195 186 176)
- HSL
- hsl(32 14% 73%)
- HWB
- hwb(32 69% 24%)
- OKLCH
- oklch(0.793 0.017 70.5)
- OKLab
- oklab(0.793 0.006 0.016)
- CIE Lab
- lab(76.05 1.99 6.28)
- LCH
- lch(76.05 6.59 72.4)
- CMYK
- cmyk(0% 5% 10% 24%)
浅色调 · 深色调 · 灰色调
浅色调
- C9C1B8
- CFC7BF
- D5CEC7
- DBD5CF
- E1DCD7
- E7E3DF
- EDEAE7
- F3F1EF
- F9F8F7
深色调
- A9A199
- 908982
- 78726C
- 605C56
- 4A4642
- 34322E
- 201E1C
- 0E0D0B
- 020201
灰色调
- BCB4AB
- B5AEA6
- AEA8A1
- A8A29D
- A19D98
- 9A9793
- 94918E
- 8D8B89
- 868685
配色和谐
互补色 +180°
- C3BAB0
Luxe Grey
- B4BDC7
≈ Stainless Steel
类似色 -30° +30°
- C3BAB0
Luxe Grey
- C6B8B3
≈ Georgian Pink
- BEBCB0
≈ Soft Sage
三角配色 +120° +240°
- C3BAB0
Luxe Grey
- B0BFBE
≈ Greenwich Village
- BFB9C4
≈ Pocketful of Posies
分裂互补色 +150° +210°
- C3BAB0
Luxe Grey
- B0BEC3
≈ Artisan Blue
- B9BBC7
≈ Silverado Trail
四角配色 +90° +180° +270°
- C3BAB0
Luxe Grey
- B3BFB8
≈ Wet Ash
- B4BDC7
≈ Stainless Steel
- C4B8BF
≈ Lavender Sand
对比度与无障碍
Ag
Fail白底
WCAG 1.91:1 · APCA Lc 37
Ag
AAA黑底
WCAG 10.97:1 · APCA Lc 66
最佳文字颜色: #000000
WCAG 10.97:1 (AAA) · APCA Lc 66
Contrast pairs
代码片段
CSS
:root {
--luxe-grey: #c3bab0;
--luxe-grey-rgb: 195 186 176;
--luxe-grey-oklch: oklch(0.793 0.017 70.5);
}
.element {
color: var(--luxe-grey);
background-color: hsl(32 14% 73%);
border-color: oklch(0.793 0.017 70.5);
}Tailwind CSS v4
@theme {
--color-luxe-grey: #c3bab0;
--color-luxe-grey-50: #f8f4f0;
--color-luxe-grey-100: #ebe7e2;
--color-luxe-grey-200: #d9d3cc;
--color-luxe-grey-300: #bdb6ae;
--color-luxe-grey-400: #a59d94;
--color-luxe-grey-500: #8e847a;
--color-luxe-grey-600: #787067;
--color-luxe-grey-700: #605a53;
--color-luxe-grey-800: #46413c;
--color-luxe-grey-900: #312d29;
--color-luxe-grey-950: #1d1a17;
}SCSS
$luxe-grey: #c3bab0;
$luxe-grey-rgb: 195, 186, 176;
$luxe-grey-light: mix(#fff, $luxe-grey, 20%);
$luxe-grey-dark: mix(#000, $luxe-grey, 20%);
.element {
color: $luxe-grey;
box-shadow: 0 0 0 2px rgba($luxe-grey, 0.35);
}