命名颜色 · #D1D3CC

Grey Nurse

Grey Nurse 即 #D1D3CC：rgb(209 211 204)、hsl(77 7% 81%)、oklch(0.863 0.01 119.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

What does Gray mean? → · Grey Nurse color name →

#D1D3CC

oklch(0.863 0.01 119.6)

颜色转换

HEX: #d1d3cc
RGB: rgb(209 211 204)
HSL: hsl(77 7% 81%)
HWB: hwb(77 80% 17%)
OKLCH: oklch(0.863 0.01 119.6)
OKLab: oklab(0.863 -0.005 0.008)
CIE Lab: lab(84.25 -1.65 3.22)
LCH: lch(84.25 3.62 117)
CMYK: cmyk(1% 0% 3% 17%)

浅色调 · 深色调 · 灰色调

浅色调

D6D7D1
DADCD6
DFE0DB
E3E4E0
E8E9E5
ECEDEA
F1F2EF
F6F6F5
FAFBFA

深色调

B5B7B1
9B9C97
81827E
686965
50514E
393A37
232422
10100F
020202

灰色调

C9CAC4
C0C2BC
B8B9B5
B0B1AD
A8A9A5
A0A09E
989896
90908F
888887

配色和谐

互补色 +180°

D1D3CC
Grey Nurse
D3D1D8
≈ Spooky Ghost

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

四角配色 +90° +180° +270°

对比度与无障碍

白底

WCAG 1.51:1 · APCA Lc 24

Fail

黑底

WCAG 13.90:1 · APCA Lc 79

AAA

最佳文字颜色: #000000

WCAG 13.90:1 (AAA) · APCA Lc 79

Contrast pairs

代码片段

CSS

:root {
  --grey-nurse: #d1d3cc;
  --grey-nurse-rgb: 209 211 204;
  --grey-nurse-oklch: oklch(0.863 0.01 119.6);
}

.element {
  color: var(--grey-nurse);
  background-color: hsl(77 7% 81%);
  border-color: oklch(0.863 0.01 119.6);
}

Tailwind CSS v4

@theme {
  --color-grey-nurse: #d1d3cc;
  --color-grey-nurse-50: #f4f5f2;
  --color-grey-nurse-100: #e7e8e5;
  --color-grey-nurse-200: #d3d5d0;
  --color-grey-nurse-300: #b6b8b3;
  --color-grey-nurse-400: #9d9f99;
  --color-grey-nurse-500: #858780;
  --color-grey-nurse-600: #71726c;
  --color-grey-nurse-700: #5a5b57;
  --color-grey-nurse-800: #42433f;
  --color-grey-nurse-900: #2d2e2b;
  --color-grey-nurse-950: #1a1b19;
}

SCSS

$grey-nurse: #d1d3cc;
$grey-nurse-rgb: 209, 211, 204;
$grey-nurse-light: mix(#fff, $grey-nurse, 20%);
$grey-nurse-dark: mix(#000, $grey-nurse, 20%);

.element {
  color: $grey-nurse;
  box-shadow: 0 0 0 2px rgba($grey-nurse, 0.35);
}

相近的命名颜色

Palettes with similar colors

在工具中打开

取色器配色组合对比度检测 Studio JSON API