命名颜色 · #C0CED6
Keepsake
Keepsake 即 #C0CED6:rgb(192 206 214)、hsl(202 21% 80%)、oklch(0.843 0.019 232.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Keepsake color name →
#C0CED6
oklch(0.843 0.019 232.6)
颜色转换
- HEX
- #c0ced6
- RGB
- rgb(192 206 214)
- HSL
- hsl(202 21% 80%)
- HWB
- hwb(202 75% 16%)
- OKLCH
- oklch(0.843 0.019 232.6)
- OKLab
- oklab(0.843 -0.012 -0.015)
- CIE Lab
- lab(81.87 -3.74 -5.7)
- LCH
- lch(81.87 6.82 236.7)
- CMYK
- cmyk(10% 4% 0% 16%)
浅色调 · 深色调 · 灰色调
浅色调
- C6D3DA
- CCD8DE
- D3DDE2
- D9E1E6
- DFE6EA
- E5EBEE
- ECF0F3
- F2F5F7
- F9FAFB
深色调
- A7B3BA
- 8E989E
- 767F84
- 5F666A
- 494E52
- 34383B
- 202325
- 0E0F10
- 020202
灰色调
- B9C6CD
- B3BEC4
- ACB6BB
- A6AEB3
- 9FA6AA
- 999EA1
- 939799
- 8C8F91
- 868788
配色和谐
互补色 +180°
- C0CED6
Keepsake
- D6C8C0
≈ Unfussy Beige
类似色 -30° +30°
- C0CED6
Keepsake
- BECFD1
≈ Detroit
- C5CCD8
≈ Winter’s Fury
三角配色 +120° +240°
- C0CED6
Keepsake
- D6C7CD
≈ Odyssey Lilac
- CBCDBF
≈ Misty Memory
分裂互补色 +150° +210°
- C0CED6
Keepsake
- D8C7C6
≈ Fairview Taupe
- D2CBBE
≈ Porch Swing Beige
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.61:1 · APCA Lc 27
Ag
AAA黑底
WCAG 13.04:1 · APCA Lc 76
最佳文字颜色: #000000
WCAG 13.04:1 (AAA) · APCA Lc 76
Contrast pairs
代码片段
CSS
:root {
--keepsake: #c0ced6;
--keepsake-rgb: 192 206 214;
--keepsake-oklch: oklch(0.843 0.019 232.6);
}
.element {
color: var(--keepsake);
background-color: hsl(202 21% 80%);
border-color: oklch(0.843 0.019 232.6);
}Tailwind CSS v4
@theme {
--color-keepsake: #c0ced6;
--color-keepsake-50: #f0f6fa;
--color-keepsake-100: #e2e9ed;
--color-keepsake-200: #cdd6db;
--color-keepsake-300: #afb9c0;
--color-keepsake-400: #94a1a8;
--color-keepsake-500: #7a8991;
--color-keepsake-600: #68747a;
--color-keepsake-700: #535c62;
--color-keepsake-800: #3c4448;
--color-keepsake-900: #292f32;
--color-keepsake-950: #171b1e;
}SCSS
$keepsake: #c0ced6;
$keepsake-rgb: 192, 206, 214;
$keepsake-light: mix(#fff, $keepsake, 20%);
$keepsake-dark: mix(#000, $keepsake, 20%);
.element {
color: $keepsake;
box-shadow: 0 0 0 2px rgba($keepsake, 0.35);
}