命名颜色 · #C2C0BB
Light French Taupe
Light French Taupe 即 #C2C0BB:rgb(194 192 187)、hsl(43 5% 75%)、oklch(0.808 0.007 88.7)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Light French Taupe color name →
#C2C0BB
oklch(0.808 0.007 88.7)
颜色转换
- HEX
- #c2c0bb
- RGB
- rgb(194 192 187)
- HSL
- hsl(43 5% 75%)
- HWB
- hwb(43 73% 24%)
- OKLCH
- oklch(0.808 0.007 88.7)
- OKLab
- oklab(0.808 0 0.007)
- CIE Lab
- lab(77.76 0.05 2.79)
- LCH
- lch(77.76 2.79 89)
- CMYK
- cmyk(0% 1% 4% 24%)
浅色调 · 深色调 · 灰色调
浅色调
- C8C6C2
- CECCC8
- D4D3CF
- DAD9D6
- E0DFDD
- E6E5E3
- ECECEA
- F3F2F1
- F9F9F8
深色调
- A8A7A2
- 8F8E8A
- 777673
- 605F5C
- 494946
- 343432
- 20201F
- 0E0E0D
- 020202
灰色调
- BBB9B5
- B4B3AF
- AEACA9
- A7A6A3
- A09F9D
- 9A9997
- 939391
- 8D8C8B
- 868686
配色和谐
互补色 +180°
- C2C0BB
Light French Taupe
- BEC0C5
≈ Neo Tokyo Grey
类似色 -30° +30°
- C2C0BB
Light French Taupe
- C4BFBC
≈ Olive Bread
- C0C1BC
≈ Light French Taupe
三角配色 +120° +240°
- C2C0BB
Light French Taupe
- BBC2C3
≈ Shallow Skies
- C3BFC2
≈ Inuit Ice
分裂互补色 +150° +210°
- C2C0BB
Light French Taupe
- BCC1C4
≈ Lazy Grey
- C1BFC4
≈ Ghost
四角配色 +90° +180° +270°
- C2C0BB
Light French Taupe
- BCC2C0
≈ Polished Rock
- BEC0C5
≈ Neo Tokyo Grey
- C4BEC0
≈ Wallis
对比度与无障碍
Ag
Fail白底
WCAG 1.81:1 · APCA Lc 34
Ag
AAA黑底
WCAG 11.55:1 · APCA Lc 69
最佳文字颜色: #000000
WCAG 11.55:1 (AAA) · APCA Lc 69
Contrast pairs
代码片段
CSS
:root {
--light-french-taupe: #c2c0bb;
--light-french-taupe-rgb: 194 192 187;
--light-french-taupe-oklch: oklch(0.808 0.007 88.7);
}
.element {
color: var(--light-french-taupe);
background-color: hsl(43 5% 75%);
border-color: oklch(0.808 0.007 88.7);
}Tailwind CSS v4
@theme {
--color-light-french-taupe: #c2c0bb;
--color-light-french-taupe-50: #f6f5f3;
--color-light-french-taupe-100: #e9e8e5;
--color-light-french-taupe-200: #d5d4d1;
--color-light-french-taupe-300: #b9b7b3;
--color-light-french-taupe-400: #a09e9a;
--color-light-french-taupe-500: #888681;
--color-light-french-taupe-600: #73716d;
--color-light-french-taupe-700: #5c5b57;
--color-light-french-taupe-800: #434240;
--color-light-french-taupe-900: #2f2e2c;
--color-light-french-taupe-950: #1b1a19;
}SCSS
$light-french-taupe: #c2c0bb;
$light-french-taupe-rgb: 194, 192, 187;
$light-french-taupe-light: mix(#fff, $light-french-taupe, 20%);
$light-french-taupe-dark: mix(#000, $light-french-taupe, 20%);
.element {
color: $light-french-taupe;
box-shadow: 0 0 0 2px rgba($light-french-taupe, 0.35);
}