命名颜色 · #C6DECF
Solitaire
Solitaire 即 #C6DECF：rgb(198 222 207)、hsl(143 27% 82%)、oklch(0.879 0.033 158.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Solitaire color name →
#C6DECF
oklch(0.879 0.033 158.2)
颜色转换
- HEX
- #c6decf
- RGB
- rgb(198 222 207)
- HSL
- hsl(143 27% 82%)
- HWB
- hwb(143 78% 13%)
- OKLCH
- oklch(0.879 0.033 158.2)
- OKLab
- oklab(0.879 -0.03 0.012)
- CIE Lab
- lab(86.36 -10.39 4.54)
- LCH
- lch(86.36 11.34 156.4)
- CMYK
- cmyk(11% 0% 7% 13%)
浅色调 · 深色调 · 灰色调
浅色调
- CCE1D4
- D1E5D8
- D7E8DD
- DDEBE2
- E2EEE7
- E8F2EC
- EEF5F0
- F4F8F5
- F9FCFA
深色调
- ACC1B4
- 92A599
- 7A897F
- 626F67
- 4B554F
- 353D38
- 212623
- 0E1210
- 020202
灰色调
- BFD4C7
- B8CABF
- B1C1B7
- A9B7AF
- A2AEA7
- 9BA49F
- 959B97
- 8E928F
- 878988
配色和谐
互补色 +180°
- C6DECF
Solitaire
- E6CFDE
≈ Summer Clover
类似色 -30° +30°
- C6DECF
Solitaire
- D1DCC5
≈ Pale Moss Green
- C0DEDB
≈ Aqua Whisper
三角配色 +120° +240°
- C6DECF
Solitaire
- D2D5ED
≈ Light Powdered Granite
- EBD0C8
≈ Charmed
分裂互补色 +150° +210°
- C6DECF
Solitaire
- DDD2E8
≈ Teary Eyed
- EBCFD3
≈ Pink Pail
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.42:1 · APCA Lc 20
Ag
AAA黑底
WCAG 14.75:1 · APCA Lc 83
最佳文字颜色: #000000
WCAG 14.75:1 (AAA) · APCA Lc 83
Contrast pairs
代码片段
CSS
:root {
--solitaire: #c6decf;
--solitaire-rgb: 198 222 207;
--solitaire-oklch: oklch(0.879 0.033 158.2);
}
.element {
color: var(--solitaire);
background-color: hsl(143 27% 82%);
border-color: oklch(0.879 0.033 158.2);
}Tailwind CSS v4
@theme {
--color-solitaire: #c6decf;
--color-solitaire-50: #eef8f2;
--color-solitaire-100: #dfebe4;
--color-solitaire-200: #c9d9cf;
--color-solitaire-300: #aabdb2;
--color-solitaire-400: #8fa597;
--color-solitaire-500: #758d7e;
--color-solitaire-600: #63776b;
--color-solitaire-700: #4f6055;
--color-solitaire-800: #39463e;
--color-solitaire-900: #27302a;
--color-solitaire-950: #151d18;
}SCSS
$solitaire: #c6decf;
$solitaire-rgb: 198, 222, 207;
$solitaire-light: mix(#fff, $solitaire, 20%);
$solitaire-dark: mix(#000, $solitaire, 20%);
.element {
color: $solitaire;
box-shadow: 0 0 0 2px rgba($solitaire, 0.35);
}