命名颜色 · #C3CDD2
New North
New North 即 #C3CDD2:rgb(195 205 210)、hsl(200 14% 79%)、oklch(0.842 0.013 229)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · New North color name →
#C3CDD2
oklch(0.842 0.013 229)
颜色转换
- HEX
- #c3cdd2
- RGB
- rgb(195 205 210)
- HSL
- hsl(200 14% 79%)
- HWB
- hwb(200 76% 18%)
- OKLCH
- oklch(0.842 0.013 229)
- OKLab
- oklab(0.842 -0.009 -0.01)
- CIE Lab
- lab(81.74 -2.81 -3.74)
- LCH
- lch(81.74 4.68 233)
- CMYK
- cmyk(7% 2% 0% 18%)
浅色调 · 深色调 · 灰色调
浅色调
- C9D2D6
- CFD7DB
- D5DCDF
- DBE1E4
- E1E6E8
- E7EBED
- EDF0F1
- F3F5F6
- F9FAFA
深色调
- A9B2B6
- 90989B
- 787E81
- 606668
- 4A4E50
- 343839
- 202324
- 0E0F10
- 020202
灰色调
- BCC5C9
- B5BDC1
- AEB5B9
- A8ADB0
- A1A6A8
- 9A9EA0
- 949698
- 8D8F90
- 868788
配色和谐
互补色 +180°
- C3CDD2
New North
- D3C9C4
≈ Crushed Almond
类似色 -30° +30°
- C3CDD2
New North
- C2CECE
≈ Tudor Ice
- C6CCD4
≈ Mega Metal Phoenix
三角配色 +120° +240°
- C3CDD2
New North
- D2C8CC
≈ El Niño
- CCCCC2
≈ Paving Stones
分裂互补色 +150° +210°
- C3CDD2
New North
- D4C8C8
≈ Lilac Tan
- D0CAC2
≈ Grey Pebble
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.61:1 · APCA Lc 28
Ag
AAA黑底
WCAG 12.98:1 · APCA Lc 75
最佳文字颜色: #000000
WCAG 12.98:1 (AAA) · APCA Lc 75
Contrast pairs
代码片段
CSS
:root {
--new-north: #c3cdd2;
--new-north-rgb: 195 205 210;
--new-north-oklch: oklch(0.842 0.013 229);
}
.element {
color: var(--new-north);
background-color: hsl(200 14% 79%);
border-color: oklch(0.842 0.013 229);
}Tailwind CSS v4
@theme {
--color-new-north: #c3cdd2;
--color-new-north-50: #f2f6f8;
--color-new-north-100: #e4e9eb;
--color-new-north-200: #cfd5d9;
--color-new-north-300: #b1b9bd;
--color-new-north-400: #97a0a5;
--color-new-north-500: #7e888d;
--color-new-north-600: #6b7377;
--color-new-north-700: #555c5f;
--color-new-north-800: #3e4346;
--color-new-north-900: #2b2f30;
--color-new-north-950: #181b1d;
}SCSS
$new-north: #c3cdd2;
$new-north-rgb: 195, 205, 210;
$new-north-light: mix(#fff, $new-north, 20%);
$new-north-dark: mix(#000, $new-north, 20%);
.element {
color: $new-north;
box-shadow: 0 0 0 2px rgba($new-north, 0.35);
}