命名颜色 · #CED0CF

Grey Pearl

Grey Pearl 即 #CED0CF：rgb(206 208 207)、hsl(150 2% 81%)、oklch(0.856 0.003 165.1)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。

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

#CED0CF

oklch(0.856 0.003 165.1)

颜色转换

HEX: #ced0cf
RGB: rgb(206 208 207)
HSL: hsl(150 2% 81%)
HWB: hwb(150 81% 18%)
OKLCH: oklch(0.856 0.003 165.1)
OKLab: oklab(0.856 -0.002 0.001)
CIE Lab: lab(83.3 -0.85 0.24)
LCH: lch(83.3 0.88 163.9)
CMYK: cmyk(1% 0% 0% 18%)

浅色调 · 深色调 · 灰色调

浅色调

D3D5D4
D8D9D8
DCDEDD
E1E3E2
E6E7E7
EBECEC
F0F1F0
F5F5F5
FAFAFA

深色调

B3B5B4
989A99
7F807F
666767
4E4F4F
383938
232323
0F1010
020202

灰色调

C6C8C7
BEBFBF
B6B7B7
AEAFAF
A6A7A7
9E9F9F
979797
8F8F8F
878888

配色和谐

互补色 +180°

CED0CF
Grey Pearl
D1CFD0
≈ Clouded Vision

类似色 -30° +30°

三角配色 +120° +240°

分裂互补色 +150° +210°

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

对比度与无障碍

白底

WCAG 1.55:1 · APCA Lc 25

Fail

黑底

WCAG 13.54:1 · APCA Lc 78

AAA

最佳文字颜色: #000000

WCAG 13.54:1 (AAA) · APCA Lc 78

Contrast pairs

代码片段

CSS

:root {
  --grey-pearl: #ced0cf;
  --grey-pearl-rgb: 206 208 207;
  --grey-pearl-oklch: oklch(0.856 0.003 165.1);
}

.element {
  color: var(--grey-pearl);
  background-color: hsl(150 2% 81%);
  border-color: oklch(0.856 0.003 165.1);
}

Tailwind CSS v4

@theme {
  --color-grey-pearl: #ced0cf;
  --color-grey-pearl-50: #f4f5f5;
  --color-grey-pearl-100: #e7e8e7;
  --color-grey-pearl-200: #d3d4d4;
  --color-grey-pearl-300: #b6b8b7;
  --color-grey-pearl-400: #9d9f9e;
  --color-grey-pearl-500: #858786;
  --color-grey-pearl-600: #707271;
  --color-grey-pearl-700: #5a5b5a;
  --color-grey-pearl-800: #424342;
  --color-grey-pearl-900: #2d2e2e;
  --color-grey-pearl-950: #1a1b1a;
}

SCSS

$grey-pearl: #ced0cf;
$grey-pearl-rgb: 206, 208, 207;
$grey-pearl-light: mix(#fff, $grey-pearl, 20%);
$grey-pearl-dark: mix(#000, $grey-pearl, 20%);

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

相近的命名颜色

Palettes with similar colors

在工具中打开

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